From 400edb4ad9ca189115403a9897584f855a6b7850 Mon Sep 17 00:00:00 2001
From: jakcharvat <jakcharvat@gmail.com>
Date: Wed, 22 Aug 2018 20:27:54 +0800
Subject: [PATCH 1/2] Add search bar

---
 app.js                                        |    7 +-
 app.scss                                      |   30 +-
 index.html                                    |   25 +-
 .../@material/theme/README.md                 |  181 +
 .../@material/theme/_color-palette.scss       |  290 +
 .../@material/theme/_constants.scss           |  283 +
 .../@material/theme/_functions.scss           |   60 +
 .../@material/theme/_mixins.scss              |   80 +
 .../@material/theme/_variables.scss           |  140 +
 .../@material/theme/dist/mdc.theme.css        |  150 +
 .../@material/theme/dist/mdc.theme.min.css    |    8 +
 .../@material/theme/mdc-theme.scss            |   42 +
 .../@material/theme/package.json              |   45 +
 .../@material/floating-label/README.md        |  110 +
 .../@material/floating-label/_mixins.scss     |   73 +
 .../@material/floating-label/_variables.scss  |   18 +
 .../@material/floating-label/adapter.js       |   64 +
 .../@material/floating-label/constants.js     |   24 +
 .../dist/mdc.floating-label.css               |   86 +
 .../dist/mdc.floating-label.min.css           |    8 +
 .../floating-label/dist/mdc.floatingLabel.js  |  797 +++
 .../dist/mdc.floatingLabel.min.js             |   23 +
 .../@material/floating-label/foundation.js    |  111 +
 .../@material/floating-label/index.js         |   74 +
 .../floating-label/mdc-floating-label.scss    |   70 +
 .../node_modules/@material/theme/README.md    |  181 +
 .../@material/theme/_color-palette.scss       |  290 +
 .../@material/theme/_constants.scss           |  283 +
 .../@material/theme/_functions.scss           |   60 +
 .../node_modules/@material/theme/_mixins.scss |   80 +
 .../@material/theme/_variables.scss           |  140 +
 .../@material/theme/dist/mdc.theme.css        |  150 +
 .../@material/theme/dist/mdc.theme.min.css    |    8 +
 .../@material/theme/mdc-theme.scss            |   42 +
 .../node_modules/@material/theme/package.json |   45 +
 .../@material/floating-label/package.json     |   56 +
 node_modules/@material/line-ripple/README.md  |   91 +
 .../@material/line-ripple/_functions.scss     |   21 +
 .../@material/line-ripple/_mixins.scss        |   21 +
 node_modules/@material/line-ripple/adapter.js |   71 +
 .../@material/line-ripple/constants.js        |   24 +
 .../line-ripple/dist/mdc.line-ripple.css      |   28 +
 .../line-ripple/dist/mdc.line-ripple.min.css  |    8 +
 .../line-ripple/dist/mdc.lineRipple.js        |  804 +++
 .../line-ripple/dist/mdc.lineRipple.min.js    |   23 +
 .../@material/line-ripple/foundation.js       |  108 +
 node_modules/@material/line-ripple/index.js   |   74 +
 .../line-ripple/mdc-line-ripple.scss          |   45 +
 .../node_modules/@material/theme/README.md    |  181 +
 .../@material/theme/_color-palette.scss       |  290 +
 .../@material/theme/_constants.scss           |  283 +
 .../@material/theme/_functions.scss           |   60 +
 .../node_modules/@material/theme/_mixins.scss |   80 +
 .../@material/theme/_variables.scss           |  140 +
 .../@material/theme/dist/mdc.theme.css        |  150 +
 .../@material/theme/dist/mdc.theme.min.css    |    8 +
 .../@material/theme/mdc-theme.scss            |   42 +
 .../node_modules/@material/theme/package.json |   45 +
 .../@material/line-ripple/package.json        |   55 +
 .../@material/notched-outline/README.md       |  133 +
 .../@material/notched-outline/_mixins.scss    |   45 +
 .../@material/notched-outline/_variables.scss |   17 +
 .../@material/notched-outline/adapter.js      |   70 +
 .../@material/notched-outline/constants.js    |   29 +
 .../dist/mdc.notched-outline.css              |   41 +
 .../dist/mdc.notched-outline.min.css          |    8 +
 .../dist/mdc.notchedOutline.js                |  802 +++
 .../dist/mdc.notchedOutline.min.js            |   23 +
 .../@material/notched-outline/foundation.js   |  124 +
 .../@material/notched-outline/index.js        |   75 +
 .../notched-outline/mdc-notched-outline.scss  |   71 +
 .../node_modules/@material/theme/README.md    |  181 +
 .../@material/theme/_color-palette.scss       |  290 +
 .../@material/theme/_constants.scss           |  283 +
 .../@material/theme/_functions.scss           |   60 +
 .../node_modules/@material/theme/_mixins.scss |   80 +
 .../@material/theme/_variables.scss           |  140 +
 .../@material/theme/dist/mdc.theme.css        |  150 +
 .../@material/theme/dist/mdc.theme.min.css    |    8 +
 .../@material/theme/mdc-theme.scss            |   42 +
 .../node_modules/@material/theme/package.json |   45 +
 .../@material/notched-outline/package.json    |   57 +
 node_modules/@material/shape/README.md        |  107 +
 node_modules/@material/shape/_mixins.scss     |   58 +
 .../@material/shape/dist/mdc.shape.css        |   39 +
 .../@material/shape/dist/mdc.shape.min.css    |    7 +
 node_modules/@material/shape/mdc-shape.scss   |   52 +
 node_modules/@material/shape/package.json     |   49 +
 node_modules/@material/textfield/README.md    |  321 +
 .../@material/textfield/_functions.scss       |   21 +
 node_modules/@material/textfield/_mixins.scss |  571 ++
 .../@material/textfield/_variables.scss       |   59 +
 node_modules/@material/textfield/adapter.js   |  207 +
 node_modules/@material/textfield/constants.js |   52 +
 .../textfield/dist/mdc.textfield.css          | 1221 ++++
 .../@material/textfield/dist/mdc.textfield.js | 5592 +++++++++++++++++
 .../textfield/dist/mdc.textfield.min.css      |    8 +
 .../textfield/dist/mdc.textfield.min.js       |  135 +
 .../@material/textfield/foundation.js         |  440 ++
 .../@material/textfield/helper-text/README.md |  117 +
 .../textfield/helper-text/_mixins.scss        |   43 +
 .../textfield/helper-text/adapter.js          |   70 +
 .../textfield/helper-text/constants.js        |   30 +
 .../textfield/helper-text/foundation.js       |  124 +
 .../@material/textfield/helper-text/index.js  |   60 +
 .../mdc-text-field-helper-text.scss           |   45 +
 .../@material/textfield/icon/README.md        |  148 +
 .../@material/textfield/icon/_mixins.scss     |   56 +
 .../@material/textfield/icon/_variables.scss  |   20 +
 .../@material/textfield/icon/adapter.js       |   77 +
 .../@material/textfield/icon/constants.js     |   24 +
 .../@material/textfield/icon/foundation.js    |  113 +
 .../@material/textfield/icon/index.js         |   62 +
 .../textfield/icon/mdc-text-field-icon.scss   |   31 +
 node_modules/@material/textfield/index.js     |  455 ++
 .../@material/textfield/mdc-text-field.scss   |  245 +
 .../node_modules/@material/ripple/README.md   |  340 +
 .../@material/ripple/_functions.scss          |   48 +
 .../@material/ripple/_keyframes.scss          |   59 +
 .../@material/ripple/_mixins.scss             |  228 +
 .../@material/ripple/_variables.scss          |   41 +
 .../node_modules/@material/ripple/adapter.js  |  110 +
 .../node_modules/@material/ripple/common.scss |   38 +
 .../@material/ripple/constants.js             |   46 +
 .../@material/ripple/dist/mdc.ripple.css      |  185 +
 .../@material/ripple/dist/mdc.ripple.js       | 1792 ++++++
 .../@material/ripple/dist/mdc.ripple.min.css  |    8 +
 .../@material/ripple/dist/mdc.ripple.min.js   |   39 +
 .../@material/ripple/foundation.js            |  604 ++
 .../node_modules/@material/ripple/index.js    |  153 +
 .../@material/ripple/mdc-ripple.scss          |   49 +
 .../@material/ripple/package.json             |   51 +
 .../node_modules/@material/ripple/util.js     |  146 +
 .../node_modules/@material/theme/README.md    |  181 +
 .../@material/theme/_color-palette.scss       |  290 +
 .../@material/theme/_constants.scss           |  283 +
 .../@material/theme/_functions.scss           |   60 +
 .../node_modules/@material/theme/_mixins.scss |   80 +
 .../@material/theme/_variables.scss           |  140 +
 .../@material/theme/dist/mdc.theme.css        |  150 +
 .../@material/theme/dist/mdc.theme.min.css    |    8 +
 .../@material/theme/mdc-theme.scss            |   42 +
 .../node_modules/@material/theme/package.json |   46 +
 node_modules/@material/textfield/package.json |   62 +
 package-lock.json                             |   90 +
 package.json                                  |    3 +
 146 files changed, 25579 insertions(+), 12 deletions(-)
 create mode 100644 node_modules/@material/.notched-outline.MODULES/@material/theme/README.md
 create mode 100644 node_modules/@material/.notched-outline.MODULES/@material/theme/_color-palette.scss
 create mode 100644 node_modules/@material/.notched-outline.MODULES/@material/theme/_constants.scss
 create mode 100644 node_modules/@material/.notched-outline.MODULES/@material/theme/_functions.scss
 create mode 100644 node_modules/@material/.notched-outline.MODULES/@material/theme/_mixins.scss
 create mode 100644 node_modules/@material/.notched-outline.MODULES/@material/theme/_variables.scss
 create mode 100644 node_modules/@material/.notched-outline.MODULES/@material/theme/dist/mdc.theme.css
 create mode 100644 node_modules/@material/.notched-outline.MODULES/@material/theme/dist/mdc.theme.min.css
 create mode 100644 node_modules/@material/.notched-outline.MODULES/@material/theme/mdc-theme.scss
 create mode 100644 node_modules/@material/.notched-outline.MODULES/@material/theme/package.json
 create mode 100644 node_modules/@material/floating-label/README.md
 create mode 100644 node_modules/@material/floating-label/_mixins.scss
 create mode 100644 node_modules/@material/floating-label/_variables.scss
 create mode 100644 node_modules/@material/floating-label/adapter.js
 create mode 100644 node_modules/@material/floating-label/constants.js
 create mode 100644 node_modules/@material/floating-label/dist/mdc.floating-label.css
 create mode 100644 node_modules/@material/floating-label/dist/mdc.floating-label.min.css
 create mode 100644 node_modules/@material/floating-label/dist/mdc.floatingLabel.js
 create mode 100644 node_modules/@material/floating-label/dist/mdc.floatingLabel.min.js
 create mode 100644 node_modules/@material/floating-label/foundation.js
 create mode 100644 node_modules/@material/floating-label/index.js
 create mode 100644 node_modules/@material/floating-label/mdc-floating-label.scss
 create mode 100644 node_modules/@material/floating-label/node_modules/@material/theme/README.md
 create mode 100644 node_modules/@material/floating-label/node_modules/@material/theme/_color-palette.scss
 create mode 100644 node_modules/@material/floating-label/node_modules/@material/theme/_constants.scss
 create mode 100644 node_modules/@material/floating-label/node_modules/@material/theme/_functions.scss
 create mode 100644 node_modules/@material/floating-label/node_modules/@material/theme/_mixins.scss
 create mode 100644 node_modules/@material/floating-label/node_modules/@material/theme/_variables.scss
 create mode 100644 node_modules/@material/floating-label/node_modules/@material/theme/dist/mdc.theme.css
 create mode 100644 node_modules/@material/floating-label/node_modules/@material/theme/dist/mdc.theme.min.css
 create mode 100644 node_modules/@material/floating-label/node_modules/@material/theme/mdc-theme.scss
 create mode 100644 node_modules/@material/floating-label/node_modules/@material/theme/package.json
 create mode 100644 node_modules/@material/floating-label/package.json
 create mode 100644 node_modules/@material/line-ripple/README.md
 create mode 100644 node_modules/@material/line-ripple/_functions.scss
 create mode 100644 node_modules/@material/line-ripple/_mixins.scss
 create mode 100644 node_modules/@material/line-ripple/adapter.js
 create mode 100644 node_modules/@material/line-ripple/constants.js
 create mode 100644 node_modules/@material/line-ripple/dist/mdc.line-ripple.css
 create mode 100644 node_modules/@material/line-ripple/dist/mdc.line-ripple.min.css
 create mode 100644 node_modules/@material/line-ripple/dist/mdc.lineRipple.js
 create mode 100644 node_modules/@material/line-ripple/dist/mdc.lineRipple.min.js
 create mode 100644 node_modules/@material/line-ripple/foundation.js
 create mode 100644 node_modules/@material/line-ripple/index.js
 create mode 100644 node_modules/@material/line-ripple/mdc-line-ripple.scss
 create mode 100644 node_modules/@material/line-ripple/node_modules/@material/theme/README.md
 create mode 100644 node_modules/@material/line-ripple/node_modules/@material/theme/_color-palette.scss
 create mode 100644 node_modules/@material/line-ripple/node_modules/@material/theme/_constants.scss
 create mode 100644 node_modules/@material/line-ripple/node_modules/@material/theme/_functions.scss
 create mode 100644 node_modules/@material/line-ripple/node_modules/@material/theme/_mixins.scss
 create mode 100644 node_modules/@material/line-ripple/node_modules/@material/theme/_variables.scss
 create mode 100644 node_modules/@material/line-ripple/node_modules/@material/theme/dist/mdc.theme.css
 create mode 100644 node_modules/@material/line-ripple/node_modules/@material/theme/dist/mdc.theme.min.css
 create mode 100644 node_modules/@material/line-ripple/node_modules/@material/theme/mdc-theme.scss
 create mode 100644 node_modules/@material/line-ripple/node_modules/@material/theme/package.json
 create mode 100644 node_modules/@material/line-ripple/package.json
 create mode 100644 node_modules/@material/notched-outline/README.md
 create mode 100644 node_modules/@material/notched-outline/_mixins.scss
 create mode 100644 node_modules/@material/notched-outline/_variables.scss
 create mode 100644 node_modules/@material/notched-outline/adapter.js
 create mode 100644 node_modules/@material/notched-outline/constants.js
 create mode 100644 node_modules/@material/notched-outline/dist/mdc.notched-outline.css
 create mode 100644 node_modules/@material/notched-outline/dist/mdc.notched-outline.min.css
 create mode 100644 node_modules/@material/notched-outline/dist/mdc.notchedOutline.js
 create mode 100644 node_modules/@material/notched-outline/dist/mdc.notchedOutline.min.js
 create mode 100644 node_modules/@material/notched-outline/foundation.js
 create mode 100644 node_modules/@material/notched-outline/index.js
 create mode 100644 node_modules/@material/notched-outline/mdc-notched-outline.scss
 create mode 100644 node_modules/@material/notched-outline/node_modules/@material/theme/README.md
 create mode 100644 node_modules/@material/notched-outline/node_modules/@material/theme/_color-palette.scss
 create mode 100644 node_modules/@material/notched-outline/node_modules/@material/theme/_constants.scss
 create mode 100644 node_modules/@material/notched-outline/node_modules/@material/theme/_functions.scss
 create mode 100644 node_modules/@material/notched-outline/node_modules/@material/theme/_mixins.scss
 create mode 100644 node_modules/@material/notched-outline/node_modules/@material/theme/_variables.scss
 create mode 100644 node_modules/@material/notched-outline/node_modules/@material/theme/dist/mdc.theme.css
 create mode 100644 node_modules/@material/notched-outline/node_modules/@material/theme/dist/mdc.theme.min.css
 create mode 100644 node_modules/@material/notched-outline/node_modules/@material/theme/mdc-theme.scss
 create mode 100644 node_modules/@material/notched-outline/node_modules/@material/theme/package.json
 create mode 100644 node_modules/@material/notched-outline/package.json
 create mode 100644 node_modules/@material/shape/README.md
 create mode 100644 node_modules/@material/shape/_mixins.scss
 create mode 100644 node_modules/@material/shape/dist/mdc.shape.css
 create mode 100644 node_modules/@material/shape/dist/mdc.shape.min.css
 create mode 100644 node_modules/@material/shape/mdc-shape.scss
 create mode 100644 node_modules/@material/shape/package.json
 create mode 100644 node_modules/@material/textfield/README.md
 create mode 100644 node_modules/@material/textfield/_functions.scss
 create mode 100644 node_modules/@material/textfield/_mixins.scss
 create mode 100644 node_modules/@material/textfield/_variables.scss
 create mode 100644 node_modules/@material/textfield/adapter.js
 create mode 100644 node_modules/@material/textfield/constants.js
 create mode 100644 node_modules/@material/textfield/dist/mdc.textfield.css
 create mode 100644 node_modules/@material/textfield/dist/mdc.textfield.js
 create mode 100644 node_modules/@material/textfield/dist/mdc.textfield.min.css
 create mode 100644 node_modules/@material/textfield/dist/mdc.textfield.min.js
 create mode 100644 node_modules/@material/textfield/foundation.js
 create mode 100644 node_modules/@material/textfield/helper-text/README.md
 create mode 100644 node_modules/@material/textfield/helper-text/_mixins.scss
 create mode 100644 node_modules/@material/textfield/helper-text/adapter.js
 create mode 100644 node_modules/@material/textfield/helper-text/constants.js
 create mode 100644 node_modules/@material/textfield/helper-text/foundation.js
 create mode 100644 node_modules/@material/textfield/helper-text/index.js
 create mode 100644 node_modules/@material/textfield/helper-text/mdc-text-field-helper-text.scss
 create mode 100644 node_modules/@material/textfield/icon/README.md
 create mode 100644 node_modules/@material/textfield/icon/_mixins.scss
 create mode 100644 node_modules/@material/textfield/icon/_variables.scss
 create mode 100644 node_modules/@material/textfield/icon/adapter.js
 create mode 100644 node_modules/@material/textfield/icon/constants.js
 create mode 100644 node_modules/@material/textfield/icon/foundation.js
 create mode 100644 node_modules/@material/textfield/icon/index.js
 create mode 100644 node_modules/@material/textfield/icon/mdc-text-field-icon.scss
 create mode 100644 node_modules/@material/textfield/index.js
 create mode 100644 node_modules/@material/textfield/mdc-text-field.scss
 create mode 100644 node_modules/@material/textfield/node_modules/@material/ripple/README.md
 create mode 100644 node_modules/@material/textfield/node_modules/@material/ripple/_functions.scss
 create mode 100644 node_modules/@material/textfield/node_modules/@material/ripple/_keyframes.scss
 create mode 100644 node_modules/@material/textfield/node_modules/@material/ripple/_mixins.scss
 create mode 100644 node_modules/@material/textfield/node_modules/@material/ripple/_variables.scss
 create mode 100644 node_modules/@material/textfield/node_modules/@material/ripple/adapter.js
 create mode 100644 node_modules/@material/textfield/node_modules/@material/ripple/common.scss
 create mode 100644 node_modules/@material/textfield/node_modules/@material/ripple/constants.js
 create mode 100644 node_modules/@material/textfield/node_modules/@material/ripple/dist/mdc.ripple.css
 create mode 100644 node_modules/@material/textfield/node_modules/@material/ripple/dist/mdc.ripple.js
 create mode 100644 node_modules/@material/textfield/node_modules/@material/ripple/dist/mdc.ripple.min.css
 create mode 100644 node_modules/@material/textfield/node_modules/@material/ripple/dist/mdc.ripple.min.js
 create mode 100644 node_modules/@material/textfield/node_modules/@material/ripple/foundation.js
 create mode 100644 node_modules/@material/textfield/node_modules/@material/ripple/index.js
 create mode 100644 node_modules/@material/textfield/node_modules/@material/ripple/mdc-ripple.scss
 create mode 100644 node_modules/@material/textfield/node_modules/@material/ripple/package.json
 create mode 100644 node_modules/@material/textfield/node_modules/@material/ripple/util.js
 create mode 100644 node_modules/@material/textfield/node_modules/@material/theme/README.md
 create mode 100644 node_modules/@material/textfield/node_modules/@material/theme/_color-palette.scss
 create mode 100644 node_modules/@material/textfield/node_modules/@material/theme/_constants.scss
 create mode 100644 node_modules/@material/textfield/node_modules/@material/theme/_functions.scss
 create mode 100644 node_modules/@material/textfield/node_modules/@material/theme/_mixins.scss
 create mode 100644 node_modules/@material/textfield/node_modules/@material/theme/_variables.scss
 create mode 100644 node_modules/@material/textfield/node_modules/@material/theme/dist/mdc.theme.css
 create mode 100644 node_modules/@material/textfield/node_modules/@material/theme/dist/mdc.theme.min.css
 create mode 100644 node_modules/@material/textfield/node_modules/@material/theme/mdc-theme.scss
 create mode 100644 node_modules/@material/textfield/node_modules/@material/theme/package.json
 create mode 100644 node_modules/@material/textfield/package.json

diff --git a/app.js b/app.js
index 99c236d..3d5d564 100644
--- a/app.js
+++ b/app.js
@@ -1,5 +1,6 @@
 import { MDCTopAppBar } from '@material/top-app-bar/index';
 import { MDCRipple } from '@material/ripple';
+import {MDCTextField} from '@material/textfield';
 
 // Top App Bar
 
@@ -30,4 +31,8 @@ gitRipple.unbounded = true;
 
 // Other Ripples
 
-const polyRipple = new MDCRipple(document.querySelector('.polyconv__media'))
\ No newline at end of file
+const polyRipple = new MDCRipple(document.querySelector('.polyconv__media'))
+
+// Text Fields
+
+const searchTextField = new MDCTextField(document.querySelector('.search-text-field--elem'));
\ No newline at end of file
diff --git a/app.scss b/app.scss
index 30c7a49..4ca5ab1 100644
--- a/app.scss
+++ b/app.scss
@@ -15,6 +15,10 @@ $mdc-theme-on-background: #FFFFFF;
 @import "@material/typography/mdc-typography";
 @import "@material/list/mdc-list";
 @import "@material/ripple/mdc-ripple";
+@import "@material/textfield/mdc-text-field";
+@import "@material/notched-outline/mdc-notched-outline";
+@import "@material/shape/mdc-shape";
+@import "@material/shape/mixins";
 
 html {
     --scroll-height: 0%;
@@ -136,7 +140,7 @@ body.no-scroll { overflow: hidden; }
 
 .back-button {
     position: absolute;
-    @include mdc-icon-button-ink-color(on-secondary);
+    @include mdc-icon-button-ink-color(on-primary);
 }
 
 .jakcharvat-logo {
@@ -387,9 +391,21 @@ body.no-scroll { overflow: hidden; }
     border-radius: 10px;
 }
 
-.mdc-list-item {
-    border-radius: 10px;
-    justify-content: center;
-    cursor: pointer;
-    color: $mdc-theme-on-secondary;
-}
\ No newline at end of file
+// ... Text Fields ...
+
+.mdc-text-field {
+    position: relative;
+
+    left: 10px;
+    width: calc(100% - 15px);
+    top: 20px;
+
+    @include mdc-text-field-focused-outline-color(on-secondary);
+    @include mdc-text-field-outline-color(on-primary);
+    @include mdc-text-field-hover-outline-color(on-secondary);
+    @include mdc-text-field-ink-color(on-secondary);
+    @include mdc-text-field-label-color(on-secondary);
+    @include mdc-text-field-caret-color(on-secondary);
+}
+
+// ... Shape ... 
diff --git a/index.html b/index.html
index 8567b85..d139464 100644
--- a/index.html
+++ b/index.html
@@ -33,7 +33,8 @@
         <span class="mdc-top-app-bar__title">openScope Tool Hub</span>
       </section>
       <section class="mdc-top-app-bar__section mdc-top-app-bar__section--align-end" role="toolbar">
-        <a href="https://github.com/jakcharvat" target="_blank" class="mdc-top-app-bar__action-item git-button" aria-label="My Github" alt="My Github">
+        <a href="https://github.com/jakcharvat" target="_blank" class="mdc-top-app-bar__action-item git-button" aria-label="My Github"
+          alt="My Github">
           <img src="imgs/github--black.png" style="width: 100%;">
         </a>
       </section>
@@ -46,12 +47,25 @@
       <div class="jakcharvat-logo">
         <img src="imgs/jakcharvat-logo--black.svg" alt="jakcharvat">
       </div>
+
+      <div class="mdc-text-field mdc-text-field--outlined search-text-field--elem">
+        <input type="text" id="search-text-field" class="mdc-text-field__input">
+        <label for="search-text-field" class="mdc-floating-label">Search...</label>
+        <div class="mdc-notched-outline">
+          <svg>
+            <path class="mdc-notched-outline__path" />
+          </svg>
+        </div>
+        <div class="mdc-notched-outline__idle"></div>
+      </div>
+
       <ul class="mdc-list">
         <a class="mdc-list-item mdc-typography--overline item1" href="https://github.com/jakcharvat/" onclick="toggleMenu()" traget="_blank">
           <p class="item">My Projects on Github</p>
           <i class="material-icons mdc-list-item__meta">open_in_new</i>
         </a>
-        <a class="mdc-list-item mdc-typography--overline item2" href="https://github.com/jakcharvat/centrelineGenerator/" onclick="toggleMenu()" traget="_blank">
+        <a class="mdc-list-item mdc-typography--overline item2" href="https://github.com/jakcharvat/centrelineGenerator/" onclick="toggleMenu()"
+          traget="_blank">
           <p class="item">This Project on Github</p>
           <i class="material-icons mdc-list-item__meta">open_in_new</i>
         </a>
@@ -59,7 +73,8 @@
           <p class="item">OpenScope</p>
           <i class="material-icons mdc-list-item__meta">open_in_new</i>
         </a>
-        <a class="mdc-list-item mdc-typography--overline item4" href="https://github.com/openscope/openscope/" onclick="toggleMenu()" traget="_blank">
+        <a class="mdc-list-item mdc-typography--overline item4" href="https://github.com/openscope/openscope/" onclick="toggleMenu()"
+          traget="_blank">
           <p class="item">OpenScope on Github</p>
           <i class="material-icons mdc-list-item__meta">open_in_new</i>
         </a>
@@ -137,7 +152,9 @@
               </p>
               <div class="centreline__description float--right margin-top--10 overflow--auto hide">
                 <div class="mdc-divider"></div>
-                <p class="mdc-card__closed-info mdc-typography--overline padding-top--5 text-align--justif overflow--autoy">Centreline Generator is a tool for generating coordinate for extended centrelines, based on the ends of the runway. The tool calculates the exact magnetic bearing between the two points, and uses that to generate a 25NM dashed centreline with dashes 0.5NM each, and a perpendicular dash every 10 dashes to indicate 5NM.</p>
+                <p class="mdc-card__closed-info mdc-typography--overline padding-top--5 text-align--justif overflow--autoy">Centreline Generator is a tool for generating coordinate for extended centrelines, based on the ends of the
+                  runway. The tool calculates the exact magnetic bearing between the two points, and uses that to generate
+                  a 25NM dashed centreline with dashes 0.5NM each, and a perpendicular dash every 10 dashes to indicate 5NM.</p>
               </div>
             </div>
             <div class="mdc-card__actions centreline__actions">
diff --git a/node_modules/@material/.notched-outline.MODULES/@material/theme/README.md b/node_modules/@material/.notched-outline.MODULES/@material/theme/README.md
new file mode 100644
index 0000000..f757529
--- /dev/null
+++ b/node_modules/@material/.notched-outline.MODULES/@material/theme/README.md
@@ -0,0 +1,181 @@
+<!--docs:
+title: "Theme"
+layout: detail
+section: components
+excerpt: "Color theming for MDC Web components."
+iconId: theme
+path: /catalog/theme/
+-->
+
+# Theme
+
+The Material Design color system can be used to create a color scheme that reflects your brand or style.
+
+## Design & API Documentation
+
+<ul class="icon-list">
+  <li class="icon-list-item icon-list-item--spec">
+    <a href="https://material.io/go/design-theming">Material Design guidelines: Color</a>
+  </li>
+</ul>
+
+## Installation
+
+```
+npm install @material/theme
+```
+
+## Usage
+
+### Color Scheme
+
+You can define the theme color variables before importing any MDC Web components:
+
+```scss
+$mdc-theme-primary: #fcb8ab;
+$mdc-theme-secondary: #feeae6;
+$mdc-theme-on-primary: #442b2d;
+$mdc-theme-on-secondary: #442b2d;
+
+@import "@material/button/mdc-button";
+```
+
+We suggest you follow the Web Content Accessibility Guidelines 2.0 when picking the values for on-primary, on-secondary, etc. These values should be accessible on top of the corresponding value, e.g. primary and secondary.
+
+https://www.w3.org/TR/WCAG20
+
+### Advanced customization
+
+Color scheme will only get you 80% of the way to a well-designed app. Inevitably there will be some components that do not work "out of the box". To fix problems with accessibility and design, we suggest you use our Sass mixins, such as `mdc-button-filled-accessible`. For more information, consult the documentation for each component.
+
+### Non-Sass customization
+
+Only a very limited number of Material Design color customization features are supported for non-Sass clients. They are a set of CSS custom properties, and a set of CSS classes.
+
+#### CSS Custom Properties
+
+**A note about `<TEXT_STYLE>`**, `<TEXT_STYLE>` represents the lowercase name of the text styles listed above, e.g. `hint`.
+
+CSS Custom property | Description
+--- | ---
+`--mdc-theme-primary` | The theme primary color
+`--mdc-theme-secondary` | The theme secondary color
+`--mdc-theme-background` | The theme background color
+`--mdc-theme-surface` | The theme surface color
+`--mdc-theme-on-primary` | Text color on top of a primary background
+`--mdc-theme-on-secondary` | Text color on top of a secondary background
+`--mdc-theme-on-surface` | Text color on top of a surface background
+`--mdc-theme-text-<TEXT_STYLE>-on-light` | Text color for TEXT_STYLE on top of light background
+`--mdc-theme-text-<TEXT_STYLE>-on-dark` | Text color for TEXT_STYLE on top of dark background
+
+#### CSS Classes
+
+> **A note about `<TEXT_STYLE>`**, `<TEXT_STYLE>` represents the lowercase name of the text styles listed above, e.g. `hint`.
+
+CSS Class | Description
+--- | ---
+`mdc-theme--primary` | Sets the text color to the theme primary color
+`mdc-theme--secondary` | Sets the text color to the theme secondary color
+`mdc-theme--background` | Sets the background color to the theme background color
+`mdc-theme--surface` | Sets the surface color to the theme surface color
+`mdc-theme--on-primary` | Sets the text color to the theme on-primary color
+`mdc-theme--on-secondary` | Sets the text color to the theme on-secondary color
+`mdc-theme--on-surface` | Sets the text color to the theme on-surface color
+`mdc-theme--primary-bg` | Sets the background color to the theme primary color
+`mdc-theme--secondary-bg` | Sets the background color to the theme secondary color
+`mdc-theme--text-<TEXT_STYLE>-on-light` | Sets text to a suitable color for TEXT_STYLE on top of light background
+`mdc-theme--text-<TEXT_STYLE>-on-dark` | Sets text to a suitable color for TEXT_STYLE on top of dark background
+
+### Sass Mixins, Variables, and Functions
+
+Mixin | Description
+--- | ---
+`mdc-theme-prop($property, $style, $important, $edgeOptOut)` | Applies a theme color or a custom color to a CSS property, optionally with `!important`. If `$edgeOptOut` is `true` and a theme color is passed, the style will be wrapped in a `@supports` clause to exclude the style in Edge to avoid issues with its buggy CSS variable support.
+
+#### `mdc-theme-prop` Properties
+
+The properties below can be used as the `$style` argument for the `mdc-theme-prop` mixin. Literal color values (e.g., `rgba(0, 0, 0, .75)`) may also be used instead.
+
+**A note about `<TEXT_STYLE>`**, `<TEXT_STYLE>` represents the lowercase name of the text styles listed above, e.g. `hint`.
+
+Property Name | Description
+--- | ---
+`primary` | The theme primary color
+`secondary` | The theme secondary color
+`background` | The theme background color
+`surface` | The theme surface color
+`text-<TEXT_STYLE>-on-light` | TEXT_STYLE on top of a light background
+`text-<TEXT_STYLE>-on-dark` | TEXT_STYLE on top of a dark background
+`on-primary` | A text/iconography color that is usable on top of primary color
+`on-secondary` | A text/iconography color that is usable on top of secondary color
+`on-surface` | A text/iconography color that is usable on top of surface color
+
+
+#### `mdc-theme-luminance($color)`
+
+Calculates the luminance value (0 - 1) of a given color.
+
+```scss
+@debug mdc-theme-luminance(#9c27b0); // 0.11654
+```
+
+#### `mdc-theme-contrast($back, $front)`
+
+Calculates the contrast ratio between two colors.
+
+```scss
+@debug mdc-theme-contrast(#9c27b0, #000); // 3.33071
+```
+
+#### `mdc-theme-tone($color)`
+
+Determines whether the given color is "light" or "dark".
+
+If the input color is a string literal equal to `"light"` or `"dark"`, it will be returned verbatim.
+
+```scss
+@debug mdc-theme-tone(#9c27b0); // dark
+@debug mdc-theme-tone(light);   // light
+```
+
+#### `mdc-theme-contrast-tone($color)`
+
+Determines whether to use light or dark text on top of a given color.
+
+```scss
+@debug mdc-theme-contrast-tone(#9c27b0); // light
+```
+
+#### `mdc-theme-prop-value($style)`
+
+If `$style` is a color (a literal color value, `currentColor`, or a CSS custom property), it is returned verbatim.
+Otherwise, `$style` is treated as a theme property name, and the corresponding value from `$mdc-theme-property-values`
+is returned. If this also fails, an error is thrown.
+
+This is mainly useful in situations where `mdc-theme-prop` cannot be used directly (e.g., `box-shadow`).
+
+Unlike the `mdc-theme-prop` mixin, this function does _not_ support CSS custom properties.
+It only returns the raw color value of the specified theme property.
+
+> NOTE: This function is defined in `_variables.scss` instead of `_functions.scss` to avoid circular imports.
+
+```scss
+@debug mdc-theme-prop-value(primary); // #3f51b5
+@debug mdc-theme-prop-value(blue);    // blue
+```
+
+#### `mdc-theme-accessible-ink-color($fill-color, $text-style: primary)`
+
+Returns an accessible ink color that has sufficient contrast against the given fill color.
+
+Params:
+
+- `$fill-color`: Supports the same values as `mdc-theme-prop-value`
+- `$text-style`: Value must be one of `primary`, `secondary`, `hint`, `disabled`, `icon` (see `$mdc-theme-text-colors`)
+
+> NOTE: This function is defined in `_variables.scss` instead of `_functions.scss` to avoid circular imports.
+
+```scss
+@debug mdc-theme-accessible-ink-color(secondary); // rgba(0, 0, 0, .87) (text-primary-on-light)
+@debug mdc-theme-accessible-ink-color(blue);      // white              (text-primary-on-dark)
+```
diff --git a/node_modules/@material/.notched-outline.MODULES/@material/theme/_color-palette.scss b/node_modules/@material/.notched-outline.MODULES/@material/theme/_color-palette.scss
new file mode 100644
index 0000000..ef5122b
--- /dev/null
+++ b/node_modules/@material/.notched-outline.MODULES/@material/theme/_color-palette.scss
@@ -0,0 +1,290 @@
+//
+// Copyright 2017 Google Inc. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+// stylelint-disable scss/dollar-variable-pattern, color-hex-length
+
+$material-color-red-50: #ffebee;
+$material-color-red-100: #ffcdd2;
+$material-color-red-200: #ef9a9a;
+$material-color-red-300: #e57373;
+$material-color-red-400: #ef5350;
+$material-color-red-500: #f44336;
+$material-color-red-600: #e53935;
+$material-color-red-700: #d32f2f;
+$material-color-red-800: #c62828;
+$material-color-red-900: #b71c1c;
+$material-color-red-a100: #ff8a80;
+$material-color-red-a200: #ff5252;
+$material-color-red-a400: #ff1744;
+$material-color-red-a700: #d50000;
+
+$material-color-pink-50: #fce4ec;
+$material-color-pink-100: #f8bbd0;
+$material-color-pink-200: #f48fb1;
+$material-color-pink-300: #f06292;
+$material-color-pink-400: #ec407a;
+$material-color-pink-500: #e91e63;
+$material-color-pink-600: #d81b60;
+$material-color-pink-700: #c2185b;
+$material-color-pink-800: #ad1457;
+$material-color-pink-900: #880e4f;
+$material-color-pink-a100: #ff80ab;
+$material-color-pink-a200: #ff4081;
+$material-color-pink-a400: #f50057;
+$material-color-pink-a700: #c51162;
+
+$material-color-purple-50: #f3e5f5;
+$material-color-purple-100: #e1bee7;
+$material-color-purple-200: #ce93d8;
+$material-color-purple-300: #ba68c8;
+$material-color-purple-400: #ab47bc;
+$material-color-purple-500: #9c27b0;
+$material-color-purple-600: #8e24aa;
+$material-color-purple-700: #7b1fa2;
+$material-color-purple-800: #6a1b9a;
+$material-color-purple-900: #4a148c;
+$material-color-purple-a100: #ea80fc;
+$material-color-purple-a200: #e040fb;
+$material-color-purple-a400: #d500f9;
+$material-color-purple-a700: #aa00ff;
+
+$material-color-deep-purple-50: #ede7f6;
+$material-color-deep-purple-100: #d1c4e9;
+$material-color-deep-purple-200: #b39ddb;
+$material-color-deep-purple-300: #9575cd;
+$material-color-deep-purple-400: #7e57c2;
+$material-color-deep-purple-500: #673ab7;
+$material-color-deep-purple-600: #5e35b1;
+$material-color-deep-purple-700: #512da8;
+$material-color-deep-purple-800: #4527a0;
+$material-color-deep-purple-900: #311b92;
+$material-color-deep-purple-a100: #b388ff;
+$material-color-deep-purple-a200: #7c4dff;
+$material-color-deep-purple-a400: #651fff;
+$material-color-deep-purple-a700: #6200ea;
+
+$material-color-indigo-50: #e8eaf6;
+$material-color-indigo-100: #c5cae9;
+$material-color-indigo-200: #9fa8da;
+$material-color-indigo-300: #7986cb;
+$material-color-indigo-400: #5c6bc0;
+$material-color-indigo-500: #3f51b5;
+$material-color-indigo-600: #3949ab;
+$material-color-indigo-700: #303f9f;
+$material-color-indigo-800: #283593;
+$material-color-indigo-900: #1a237e;
+$material-color-indigo-a100: #8c9eff;
+$material-color-indigo-a200: #536dfe;
+$material-color-indigo-a400: #3d5afe;
+$material-color-indigo-a700: #304ffe;
+
+$material-color-blue-50: #e3f2fd;
+$material-color-blue-100: #bbdefb;
+$material-color-blue-200: #90caf9;
+$material-color-blue-300: #64b5f6;
+$material-color-blue-400: #42a5f5;
+$material-color-blue-500: #2196f3;
+$material-color-blue-600: #1e88e5;
+$material-color-blue-700: #1976d2;
+$material-color-blue-800: #1565c0;
+$material-color-blue-900: #0d47a1;
+$material-color-blue-a100: #82b1ff;
+$material-color-blue-a200: #448aff;
+$material-color-blue-a400: #2979ff;
+$material-color-blue-a700: #2962ff;
+
+$material-color-light-blue-50: #e1f5fe;
+$material-color-light-blue-100: #b3e5fc;
+$material-color-light-blue-200: #81d4fa;
+$material-color-light-blue-300: #4fc3f7;
+$material-color-light-blue-400: #29b6f6;
+$material-color-light-blue-500: #03a9f4;
+$material-color-light-blue-600: #039be5;
+$material-color-light-blue-700: #0288d1;
+$material-color-light-blue-800: #0277bd;
+$material-color-light-blue-900: #01579b;
+$material-color-light-blue-a100: #80d8ff;
+$material-color-light-blue-a200: #40c4ff;
+$material-color-light-blue-a400: #00b0ff;
+$material-color-light-blue-a700: #0091ea;
+
+$material-color-cyan-50: #e0f7fa;
+$material-color-cyan-100: #b2ebf2;
+$material-color-cyan-200: #80deea;
+$material-color-cyan-300: #4dd0e1;
+$material-color-cyan-400: #26c6da;
+$material-color-cyan-500: #00bcd4;
+$material-color-cyan-600: #00acc1;
+$material-color-cyan-700: #0097a7;
+$material-color-cyan-800: #00838f;
+$material-color-cyan-900: #006064;
+$material-color-cyan-a100: #84ffff;
+$material-color-cyan-a200: #18ffff;
+$material-color-cyan-a400: #00e5ff;
+$material-color-cyan-a700: #00b8d4;
+
+$material-color-teal-50: #e0f2f1;
+$material-color-teal-100: #b2dfdb;
+$material-color-teal-200: #80cbc4;
+$material-color-teal-300: #4db6ac;
+$material-color-teal-400: #26a69a;
+$material-color-teal-500: #009688;
+$material-color-teal-600: #00897b;
+$material-color-teal-700: #00796b;
+$material-color-teal-800: #00695c;
+$material-color-teal-900: #004d40;
+$material-color-teal-a100: #a7ffeb;
+$material-color-teal-a200: #64ffda;
+$material-color-teal-a400: #1de9b6;
+$material-color-teal-a700: #00bfa5;
+
+$material-color-green-50: #e8f5e9;
+$material-color-green-100: #c8e6c9;
+$material-color-green-200: #a5d6a7;
+$material-color-green-300: #81c784;
+$material-color-green-400: #66bb6a;
+$material-color-green-500: #4caf50;
+$material-color-green-600: #43a047;
+$material-color-green-700: #388e3c;
+$material-color-green-800: #2e7d32;
+$material-color-green-900: #1b5e20;
+$material-color-green-a100: #b9f6ca;
+$material-color-green-a200: #69f0ae;
+$material-color-green-a400: #00e676;
+$material-color-green-a700: #00c853;
+
+$material-color-light-green-50: #f1f8e9;
+$material-color-light-green-100: #dcedc8;
+$material-color-light-green-200: #c5e1a5;
+$material-color-light-green-300: #aed581;
+$material-color-light-green-400: #9ccc65;
+$material-color-light-green-500: #8bc34a;
+$material-color-light-green-600: #7cb342;
+$material-color-light-green-700: #689f38;
+$material-color-light-green-800: #558b2f;
+$material-color-light-green-900: #33691e;
+$material-color-light-green-a100: #ccff90;
+$material-color-light-green-a200: #b2ff59;
+$material-color-light-green-a400: #76ff03;
+$material-color-light-green-a700: #64dd17;
+
+$material-color-lime-50: #f9fbe7;
+$material-color-lime-100: #f0f4c3;
+$material-color-lime-200: #e6ee9c;
+$material-color-lime-300: #dce775;
+$material-color-lime-400: #d4e157;
+$material-color-lime-500: #cddc39;
+$material-color-lime-600: #c0ca33;
+$material-color-lime-700: #afb42b;
+$material-color-lime-800: #9e9d24;
+$material-color-lime-900: #827717;
+$material-color-lime-a100: #f4ff81;
+$material-color-lime-a200: #eeff41;
+$material-color-lime-a400: #c6ff00;
+$material-color-lime-a700: #aeea00;
+
+$material-color-yellow-50: #fffde7;
+$material-color-yellow-100: #fff9c4;
+$material-color-yellow-200: #fff59d;
+$material-color-yellow-300: #fff176;
+$material-color-yellow-400: #ffee58;
+$material-color-yellow-500: #ffeb3b;
+$material-color-yellow-600: #fdd835;
+$material-color-yellow-700: #fbc02d;
+$material-color-yellow-800: #f9a825;
+$material-color-yellow-900: #f57f17;
+$material-color-yellow-a100: #ffff8d;
+$material-color-yellow-a200: #ffff00;
+$material-color-yellow-a400: #ffea00;
+$material-color-yellow-a700: #ffd600;
+
+$material-color-amber-50: #fff8e1;
+$material-color-amber-100: #ffecb3;
+$material-color-amber-200: #ffe082;
+$material-color-amber-300: #ffd54f;
+$material-color-amber-400: #ffca28;
+$material-color-amber-500: #ffc107;
+$material-color-amber-600: #ffb300;
+$material-color-amber-700: #ffa000;
+$material-color-amber-800: #ff8f00;
+$material-color-amber-900: #ff6f00;
+$material-color-amber-a100: #ffe57f;
+$material-color-amber-a200: #ffd740;
+$material-color-amber-a400: #ffc400;
+$material-color-amber-a700: #ffab00;
+
+$material-color-orange-50: #fff3e0;
+$material-color-orange-100: #ffe0b2;
+$material-color-orange-200: #ffcc80;
+$material-color-orange-300: #ffb74d;
+$material-color-orange-400: #ffa726;
+$material-color-orange-500: #ff9800;
+$material-color-orange-600: #fb8c00;
+$material-color-orange-700: #f57c00;
+$material-color-orange-800: #ef6c00;
+$material-color-orange-900: #e65100;
+$material-color-orange-a100: #ffd180;
+$material-color-orange-a200: #ffab40;
+$material-color-orange-a400: #ff9100;
+$material-color-orange-a700: #ff6d00;
+
+$material-color-deep-orange-50: #fbe9e7;
+$material-color-deep-orange-100: #ffccbc;
+$material-color-deep-orange-200: #ffab91;
+$material-color-deep-orange-300: #ff8a65;
+$material-color-deep-orange-400: #ff7043;
+$material-color-deep-orange-500: #ff5722;
+$material-color-deep-orange-600: #f4511e;
+$material-color-deep-orange-700: #e64a19;
+$material-color-deep-orange-800: #d84315;
+$material-color-deep-orange-900: #bf360c;
+$material-color-deep-orange-a100: #ff9e80;
+$material-color-deep-orange-a200: #ff6e40;
+$material-color-deep-orange-a400: #ff3d00;
+$material-color-deep-orange-a700: #dd2c00;
+
+$material-color-brown-50: #efebe9;
+$material-color-brown-100: #d7ccc8;
+$material-color-brown-200: #bcaaa4;
+$material-color-brown-300: #a1887f;
+$material-color-brown-400: #8d6e63;
+$material-color-brown-500: #795548;
+$material-color-brown-600: #6d4c41;
+$material-color-brown-700: #5d4037;
+$material-color-brown-800: #4e342e;
+$material-color-brown-900: #3e2723;
+
+$material-color-grey-50: #fafafa;
+$material-color-grey-100: #f5f5f5;
+$material-color-grey-200: #eeeeee;
+$material-color-grey-300: #e0e0e0;
+$material-color-grey-400: #bdbdbd;
+$material-color-grey-500: #9e9e9e;
+$material-color-grey-600: #757575;
+$material-color-grey-700: #616161;
+$material-color-grey-800: #424242;
+$material-color-grey-900: #212121;
+
+$material-color-blue-grey-50: #eceff1;
+$material-color-blue-grey-100: #cfd8dc;
+$material-color-blue-grey-200: #b0bec5;
+$material-color-blue-grey-300: #90a4ae;
+$material-color-blue-grey-400: #78909c;
+$material-color-blue-grey-500: #607d8b;
+$material-color-blue-grey-600: #546e7a;
+$material-color-blue-grey-700: #455a64;
+$material-color-blue-grey-800: #37474f;
+$material-color-blue-grey-900: #263238;
diff --git a/node_modules/@material/.notched-outline.MODULES/@material/theme/_constants.scss b/node_modules/@material/.notched-outline.MODULES/@material/theme/_constants.scss
new file mode 100644
index 0000000..baa150d
--- /dev/null
+++ b/node_modules/@material/.notched-outline.MODULES/@material/theme/_constants.scss
@@ -0,0 +1,283 @@
+//
+// Copyright 2017 Google Inc. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+// Precomputed linear color channel values, for use in contrast calculations.
+// See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+//
+// Algorithm, for c in 0 to 255:
+// f(c) {
+//   c = c / 255;
+//   return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+// }
+//
+// This lookup table is needed since there is no `pow` in SASS.
+$mdc-theme-linear-channel-values:
+  0
+  .0003035269835488375
+  .000607053967097675
+  .0009105809506465125
+  .00121410793419535
+  .0015176349177441874
+  .001821161901293025
+  .0021246888848418626
+  .0024282158683907
+  .0027317428519395373
+  .003035269835488375
+  .003346535763899161
+  .003676507324047436
+  .004024717018496307
+  .004391442037410293
+  .004776953480693729
+  .005181516702338386
+  .005605391624202723
+  .006048833022857054
+  .006512090792594475
+  .006995410187265387
+  .007499032043226175
+  .008023192985384994
+  .008568125618069307
+  .009134058702220787
+  .00972121732023785
+  .010329823029626936
+  .010960094006488246
+  .011612245179743885
+  .012286488356915872
+  .012983032342173012
+  .013702083047289686
+  .014443843596092545
+  .01520851442291271
+  .01599629336550963
+  .016807375752887384
+  .017641954488384078
+  .018500220128379697
+  .019382360956935723
+  .0202885630566524
+  .021219010376003555
+  .022173884793387385
+  .02315336617811041
+  .024157632448504756
+  .02518685962736163
+  .026241221894849898
+  .027320891639074894
+  .028426039504420793
+  .0295568344378088
+  .030713443732993635
+  .03189603307301153
+  .033104766570885055
+  .03433980680868217
+  .03560131487502034
+  .03688945040110004
+  .0382043715953465
+  .03954623527673284
+  .04091519690685319
+  .042311410620809675
+  .043735029256973465
+  .04518620438567554
+  .046665086336880095
+  .04817182422688942
+  .04970656598412723
+  .05126945837404324
+  .052860647023180246
+  .05448027644244237
+  .05612849004960009
+  .05780543019106723
+  .0595112381629812
+  .06124605423161761
+  .06301001765316767
+  .06480326669290577
+  .06662593864377289
+  .06847816984440017
+  .07036009569659588
+  .07227185068231748
+  .07421356838014963
+  .07618538148130785
+  .07818742180518633
+  .08021982031446832
+  .0822827071298148
+  .08437621154414882
+  .08650046203654976
+  .08865558628577294
+  .09084171118340768
+  .09305896284668745
+  .0953074666309647
+  .09758734714186246
+  .09989872824711389
+  .10224173308810132
+  .10461648409110419
+  .10702310297826761
+  .10946171077829933
+  .1119324278369056
+  .11443537382697373
+  .11697066775851084
+  .11953842798834562
+  .12213877222960187
+  .12477181756095049
+  .12743768043564743
+  .1301364766903643
+  .13286832155381798
+  .13563332965520566
+  .13843161503245183
+  .14126329114027164
+  .14412847085805777
+  .14702726649759498
+  .14995978981060856
+  .15292615199615017
+  .1559264637078274
+  .1589608350608804
+  .162029375639111
+  .1651321945016676
+  .16826940018969075
+  .1714411007328226
+  .17464740365558504
+  .17788841598362912
+  .18116424424986022
+  .184474994500441
+  .18782077230067787
+  .19120168274079138
+  .1946178304415758
+  .19806931955994886
+  .20155625379439707
+  .20507873639031693
+  .20863687014525575
+  .21223075741405523
+  .21586050011389926
+  .2195261997292692
+  .2232279573168085
+  .22696587351009836
+  .23074004852434915
+  .23455058216100522
+  .238397573812271
+  .24228112246555486
+  .24620132670783548
+  .25015828472995344
+  .25415209433082675
+  .2581828529215958
+  .26225065752969623
+  .26635560480286247
+  .2704977910130658
+  .27467731206038465
+  .2788942634768104
+  .2831487404299921
+  .2874408377269175
+  .29177064981753587
+  .2961382707983211
+  .3005437944157765
+  .3049873140698863
+  .30946892281750854
+  .31398871337571754
+  .31854677812509186
+  .32314320911295075
+  .3277780980565422
+  .33245153634617935
+  .33716361504833037
+  .3419144249086609
+  .3467040563550296
+  .35153259950043936
+  .3564001441459435
+  .3613067797835095
+  .3662525955988395
+  .3712376804741491
+  .3762621229909065
+  .38132601143253014
+  .386429433787049
+  .39157247774972326
+  .39675523072562685
+  .4019777798321958
+  .4072402119017367
+  .41254261348390375
+  .4178850708481375
+  .4232676699860717
+  .4286904966139066
+  .43415363617474895
+  .4396571738409188
+  .44520119451622786
+  .45078578283822346
+  .45641102318040466
+  .4620769996544071
+  .467783796112159
+  .47353149614800955
+  .4793201831008268
+  .4851499400560704
+  .4910208498478356
+  .4969329950608704
+  .5028864580325687
+  .5088813208549338
+  .5149176653765214
+  .5209955732043543
+  .5271151257058131
+  .5332764040105052
+  .5394794890121072
+  .5457244613701866
+  .5520114015120001
+  .5583403896342679
+  .5647115057049292
+  .5711248294648731
+  .5775804404296506
+  .5840784178911641
+  .5906188409193369
+  .5972017883637634
+  .6038273388553378
+  .6104955708078648
+  .6172065624196511
+  .6239603916750761
+  .6307571363461468
+  .6375968739940326
+  .6444796819705821
+  .6514056374198242
+  .6583748172794485
+  .665387298282272
+  .6724431569576875
+  .6795424696330938
+  .6866853124353135
+  .6938717612919899
+  .7011018919329731
+  .7083757798916868
+  .7156935005064807
+  .7230551289219693
+  .7304607400903537
+  .7379104087727308
+  .7454042095403874
+  .7529422167760779
+  .7605245046752924
+  .768151147247507
+  .7758222183174236
+  .7835377915261935
+  .7912979403326302
+  .799102738014409
+  .8069522576692516
+  .8148465722161012
+  .8227857543962835
+  .8307698767746546
+  .83879901174074
+  .846873231509858
+  .8549926081242338
+  .8631572134541023
+  .8713671191987972
+  .8796223968878317
+  .8879231178819663
+  .8962693533742664
+  .9046611743911496
+  .9130986517934192
+  .9215818562772946
+  .9301108583754237
+  .938685728457888
+  .9473065367331999
+  .9559733532492861
+  .9646862478944651
+  .9734452903984125
+  .9822505503331171
+  .9911020971138298
+  1;
diff --git a/node_modules/@material/.notched-outline.MODULES/@material/theme/_functions.scss b/node_modules/@material/.notched-outline.MODULES/@material/theme/_functions.scss
new file mode 100644
index 0000000..acf2ff7
--- /dev/null
+++ b/node_modules/@material/.notched-outline.MODULES/@material/theme/_functions.scss
@@ -0,0 +1,60 @@
+//
+// Copyright 2017 Google Inc. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+@import "./constants";
+
+// Calculate the luminance for a color.
+// See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+@function mdc-theme-luminance($color) {
+  $red: nth($mdc-theme-linear-channel-values, red($color) + 1);
+  $green: nth($mdc-theme-linear-channel-values, green($color) + 1);
+  $blue: nth($mdc-theme-linear-channel-values, blue($color) + 1);
+
+  @return .2126 * $red + .7152 * $green + .0722 * $blue;
+}
+
+// Calculate the contrast ratio between two colors.
+// See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+@function mdc-theme-contrast($back, $front) {
+  $backLum: mdc-theme-luminance($back) + .05;
+  $foreLum: mdc-theme-luminance($front) + .05;
+
+  @return max($backLum, $foreLum) / min($backLum, $foreLum);
+}
+
+// Determine whether the color is "light" or "dark".
+@function mdc-theme-tone($color) {
+  @if $color == "dark" or $color == "light" {
+    @return $color;
+  }
+
+  $minimumContrast: 3.1;
+
+  $lightContrast: mdc-theme-contrast($color, white);
+  $darkContrast: mdc-theme-contrast($color, rgba(black, .87));
+
+  @if ($lightContrast < $minimumContrast) and ($darkContrast > $lightContrast) {
+    @return "light";
+  } @else {
+    @return "dark";
+  }
+}
+
+// Determine whether to use dark or light text on top of given color to meet accessibility standards for contrast.
+// Returns "dark" if the given color is light and "light" if the given color is dark.
+@function mdc-theme-contrast-tone($color) {
+  @return if(mdc-theme-tone($color) == "dark", "light", "dark");
+}
diff --git a/node_modules/@material/.notched-outline.MODULES/@material/theme/_mixins.scss b/node_modules/@material/.notched-outline.MODULES/@material/theme/_mixins.scss
new file mode 100644
index 0000000..9510df2
--- /dev/null
+++ b/node_modules/@material/.notched-outline.MODULES/@material/theme/_mixins.scss
@@ -0,0 +1,80 @@
+//
+// Copyright 2017 Google Inc. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+@import "./variables";
+
+// Applies the correct theme color style to the specified property.
+// $property is typically color or background-color, but can be any CSS property that accepts color values.
+// $style should be one of the map keys in $mdc-theme-property-values (_variables.scss), or a color value.
+// $edgeOptOut controls whether to feature-detect around Edge to avoid emitting CSS variables for it,
+// intended for use in cases where interactions with pseudo-element styles cause problems due to Edge bugs.
+@mixin mdc-theme-prop($property, $style, $important: false, $edgeOptOut: false) {
+  @if mdc-theme-is-valid-theme-prop-value_($style) {
+    @if $important {
+      #{$property}: $style !important;
+    } @else {
+      #{$property}: $style;
+    }
+  } @else {
+    @if not map-has-key($mdc-theme-property-values, $style) {
+      @error "Invalid style: '#{$style}'. Choose one of: #{map-keys($mdc-theme-property-values)}";
+    }
+
+    $value: map-get($mdc-theme-property-values, $style);
+
+    @if $important {
+      #{$property}: $value !important;
+
+      @if $edgeOptOut {
+        // stylelint-disable max-nesting-depth
+        @at-root {
+          @supports not (-ms-ime-align:auto) {
+            // stylelint-disable scss/selector-no-redundant-nesting-selector
+            & {
+              /* @alternate */
+              #{$property}: var(--mdc-theme-#{$style}, $value) !important;
+            }
+            // stylelint-enable scss/selector-no-redundant-nesting-selector
+          }
+        }
+        // stylelint-enable max-nesting-depth
+      } @else {
+        /* @alternate */
+        #{$property}: var(--mdc-theme-#{$style}, $value) !important;
+      }
+    } @else {
+      #{$property}: $value;
+
+      @if $edgeOptOut {
+        // stylelint-disable max-nesting-depth
+        @at-root {
+          @supports not (-ms-ime-align:auto) {
+            // stylelint-disable scss/selector-no-redundant-nesting-selector
+            & {
+              /* @alternate */
+              #{$property}: var(--mdc-theme-#{$style}, $value);
+            }
+            // stylelint-enable scss/selector-no-redundant-nesting-selector
+          }
+        }
+        // stylelint-enable max-nesting-depth
+      } @else {
+        /* @alternate */
+        #{$property}: var(--mdc-theme-#{$style}, $value);
+      }
+    }
+  }
+}
diff --git a/node_modules/@material/.notched-outline.MODULES/@material/theme/_variables.scss b/node_modules/@material/.notched-outline.MODULES/@material/theme/_variables.scss
new file mode 100644
index 0000000..8c962f3
--- /dev/null
+++ b/node_modules/@material/.notched-outline.MODULES/@material/theme/_variables.scss
@@ -0,0 +1,140 @@
+//
+// Copyright 2017 Google Inc. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+@import "./functions";
+
+//
+// Main theme colors for your brand.
+//
+// If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+//
+
+$mdc-theme-primary: #6200ee !default; // baseline purple, 500 tone
+$mdc-theme-on-primary: if(mdc-theme-contrast-tone($mdc-theme-primary) == "dark", #000, #fff) !default;
+
+// The $mdc-theme-accent variable is DEPRECATED - it exists purely for backward compatibility.
+// The $mdc-theme-secondary* variables should be used for all new projects.
+$mdc-theme-accent: #018786 !default; // baseline teal, 600 tone
+$mdc-theme-secondary: $mdc-theme-accent !default;
+$mdc-theme-on-secondary: if(mdc-theme-contrast-tone($mdc-theme-secondary) == "dark", #000, #fff) !default;
+$mdc-theme-background: #fff !default; // White
+
+$mdc-theme-surface: #fff !default;
+$mdc-theme-on-surface: if(mdc-theme-contrast-tone($mdc-theme-surface) == "dark", #000, #fff) !default;
+
+//
+// Text colors according to light vs dark and text type.
+//
+
+$mdc-theme-text-colors: (
+  dark: (
+    primary: rgba(black, .87),
+    secondary: rgba(black, .54),
+    hint: rgba(black, .38),
+    disabled: rgba(black, .38),
+    icon: rgba(black, .38)
+  ),
+  light: (
+    primary: white,
+    secondary: rgba(white, .7),
+    hint: rgba(white, .5),
+    disabled: rgba(white, .5),
+    icon: rgba(white, .5)
+  )
+) !default;
+
+@function mdc-theme-ink-color-for-fill_($text-style, $fill-color) {
+  $contrast-tone: mdc-theme-contrast-tone($fill-color);
+
+  @return map-get(map-get($mdc-theme-text-colors, $contrast-tone), $text-style);
+}
+
+//
+// Primary text colors for each of the theme colors.
+//
+
+$mdc-theme-property-values: (
+  // Primary
+  primary: $mdc-theme-primary,
+  // Secondary
+  secondary: $mdc-theme-secondary,
+  // Background
+  background: $mdc-theme-background,
+  // Surface
+  surface: $mdc-theme-surface,
+  on-primary: $mdc-theme-on-primary,
+  on-secondary: $mdc-theme-on-secondary,
+  on-surface: $mdc-theme-on-surface,
+  // Text-primary on "background" background
+  text-primary-on-background: mdc-theme-ink-color-for-fill_(primary, $mdc-theme-background),
+  text-secondary-on-background: mdc-theme-ink-color-for-fill_(secondary, $mdc-theme-background),
+  text-hint-on-background: mdc-theme-ink-color-for-fill_(hint, $mdc-theme-background),
+  text-disabled-on-background: mdc-theme-ink-color-for-fill_(disabled, $mdc-theme-background),
+  text-icon-on-background: mdc-theme-ink-color-for-fill_(icon, $mdc-theme-background),
+  // Text-primary on "light" background
+  text-primary-on-light: mdc-theme-ink-color-for-fill_(primary, light),
+  text-secondary-on-light: mdc-theme-ink-color-for-fill_(secondary, light),
+  text-hint-on-light: mdc-theme-ink-color-for-fill_(hint, light),
+  text-disabled-on-light: mdc-theme-ink-color-for-fill_(disabled, light),
+  text-icon-on-light: mdc-theme-ink-color-for-fill_(icon, light),
+  // Text-primary on "dark" background
+  text-primary-on-dark: mdc-theme-ink-color-for-fill_(primary, dark),
+  text-secondary-on-dark: mdc-theme-ink-color-for-fill_(secondary, dark),
+  text-hint-on-dark: mdc-theme-ink-color-for-fill_(hint, dark),
+  text-disabled-on-dark: mdc-theme-ink-color-for-fill_(disabled, dark),
+  text-icon-on-dark: mdc-theme-ink-color-for-fill_(icon, dark)
+);
+
+// If `$style` is a color (a literal color value, `currentColor`, or a CSS custom property), it is returned verbatim.
+// Otherwise, `$style` is treated as a theme property name, and the corresponding value from
+// `$mdc-theme-property-values` is returned. If this also fails, an error is thrown.
+//
+// This is mainly useful in situations where `mdc-theme-prop` cannot be used directly (e.g., `box-shadow`).
+//
+// Examples:
+//
+// 1. mdc-theme-prop-value(primary) => "#6200ee"
+// 2. mdc-theme-prop-value(blue)    => "blue"
+//
+// NOTE: This function must be defined in _variables.scss instead of _functions.scss to avoid circular imports.
+@function mdc-theme-prop-value($style) {
+  @if mdc-theme-is-valid-theme-prop-value_($style) {
+    @return $style;
+  }
+
+  @if not map-has-key($mdc-theme-property-values, $style) {
+    @error "Invalid theme property: '#{$style}'. Choose one of: #{map-keys($mdc-theme-property-values)}";
+  }
+
+  @return map-get($mdc-theme-property-values, $style);
+}
+
+// NOTE: This function must be defined in _variables.scss instead of _functions.scss to avoid circular imports.
+@function mdc-theme-accessible-ink-color($fill-color, $text-style: primary) {
+  $fill-color-value: mdc-theme-prop-value($fill-color);
+  $color-map-for-tone: map-get($mdc-theme-text-colors, mdc-theme-contrast-tone($fill-color-value));
+
+  @if not map-has-key($color-map-for-tone, $text-style) {
+    @error "Invalid $text-style: '#{$text-style}'. Choose one of: #{map-keys($color-map-for-tone)}";
+  }
+
+  @return map-get($color-map-for-tone, $text-style);
+}
+
+// NOTE: This function is depended upon by mdc-theme-prop-value (above) and thus must be defined in this file.
+@function mdc-theme-is-valid-theme-prop-value_($style) {
+  @return type-of($style) == "color" or $style == "currentColor" or str_slice($style, 1, 4) == "var(";
+}
diff --git a/node_modules/@material/.notched-outline.MODULES/@material/theme/dist/mdc.theme.css b/node_modules/@material/.notched-outline.MODULES/@material/theme/dist/mdc.theme.css
new file mode 100644
index 0000000..9d4696f
--- /dev/null
+++ b/node_modules/@material/.notched-outline.MODULES/@material/theme/dist/mdc.theme.css
@@ -0,0 +1,150 @@
+/*!
+ Material Components for the Web
+ Copyright (c) 2018 Google Inc.
+ License: Apache-2.0
+*/
+:root {
+  --mdc-theme-primary: #6200ee;
+  --mdc-theme-secondary: #018786;
+  --mdc-theme-background: #fff;
+  --mdc-theme-surface: #fff;
+  --mdc-theme-on-primary: #fff;
+  --mdc-theme-on-secondary: #fff;
+  --mdc-theme-on-surface: #000;
+  --mdc-theme-text-primary-on-background: rgba(0, 0, 0, 0.87);
+  --mdc-theme-text-secondary-on-background: rgba(0, 0, 0, 0.54);
+  --mdc-theme-text-hint-on-background: rgba(0, 0, 0, 0.38);
+  --mdc-theme-text-disabled-on-background: rgba(0, 0, 0, 0.38);
+  --mdc-theme-text-icon-on-background: rgba(0, 0, 0, 0.38);
+  --mdc-theme-text-primary-on-light: rgba(0, 0, 0, 0.87);
+  --mdc-theme-text-secondary-on-light: rgba(0, 0, 0, 0.54);
+  --mdc-theme-text-hint-on-light: rgba(0, 0, 0, 0.38);
+  --mdc-theme-text-disabled-on-light: rgba(0, 0, 0, 0.38);
+  --mdc-theme-text-icon-on-light: rgba(0, 0, 0, 0.38);
+  --mdc-theme-text-primary-on-dark: white;
+  --mdc-theme-text-secondary-on-dark: rgba(255, 255, 255, 0.7);
+  --mdc-theme-text-hint-on-dark: rgba(255, 255, 255, 0.5);
+  --mdc-theme-text-disabled-on-dark: rgba(255, 255, 255, 0.5);
+  --mdc-theme-text-icon-on-dark: rgba(255, 255, 255, 0.5); }
+
+.mdc-theme--primary {
+  color: #6200ee !important;
+  /* @alternate */
+  color: var(--mdc-theme-primary, #6200ee) !important; }
+
+.mdc-theme--secondary {
+  color: #018786 !important;
+  /* @alternate */
+  color: var(--mdc-theme-secondary, #018786) !important; }
+
+.mdc-theme--background {
+  background-color: #fff;
+  /* @alternate */
+  background-color: var(--mdc-theme-background, #fff); }
+
+.mdc-theme--surface {
+  background-color: #fff;
+  /* @alternate */
+  background-color: var(--mdc-theme-surface, #fff); }
+
+.mdc-theme--on-primary {
+  color: #fff !important;
+  /* @alternate */
+  color: var(--mdc-theme-on-primary, #fff) !important; }
+
+.mdc-theme--on-secondary {
+  color: #fff !important;
+  /* @alternate */
+  color: var(--mdc-theme-on-secondary, #fff) !important; }
+
+.mdc-theme--on-surface {
+  color: #000 !important;
+  /* @alternate */
+  color: var(--mdc-theme-on-surface, #000) !important; }
+
+.mdc-theme--text-primary-on-background {
+  color: rgba(0, 0, 0, 0.87) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-primary-on-background, rgba(0, 0, 0, 0.87)) !important; }
+
+.mdc-theme--text-secondary-on-background {
+  color: rgba(0, 0, 0, 0.54) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-secondary-on-background, rgba(0, 0, 0, 0.54)) !important; }
+
+.mdc-theme--text-hint-on-background {
+  color: rgba(0, 0, 0, 0.38) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-hint-on-background, rgba(0, 0, 0, 0.38)) !important; }
+
+.mdc-theme--text-disabled-on-background {
+  color: rgba(0, 0, 0, 0.38) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-disabled-on-background, rgba(0, 0, 0, 0.38)) !important; }
+
+.mdc-theme--text-icon-on-background {
+  color: rgba(0, 0, 0, 0.38) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-icon-on-background, rgba(0, 0, 0, 0.38)) !important; }
+
+.mdc-theme--text-primary-on-light {
+  color: rgba(0, 0, 0, 0.87) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-primary-on-light, rgba(0, 0, 0, 0.87)) !important; }
+
+.mdc-theme--text-secondary-on-light {
+  color: rgba(0, 0, 0, 0.54) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-secondary-on-light, rgba(0, 0, 0, 0.54)) !important; }
+
+.mdc-theme--text-hint-on-light {
+  color: rgba(0, 0, 0, 0.38) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-hint-on-light, rgba(0, 0, 0, 0.38)) !important; }
+
+.mdc-theme--text-disabled-on-light {
+  color: rgba(0, 0, 0, 0.38) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-disabled-on-light, rgba(0, 0, 0, 0.38)) !important; }
+
+.mdc-theme--text-icon-on-light {
+  color: rgba(0, 0, 0, 0.38) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-icon-on-light, rgba(0, 0, 0, 0.38)) !important; }
+
+.mdc-theme--text-primary-on-dark {
+  color: white !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-primary-on-dark, white) !important; }
+
+.mdc-theme--text-secondary-on-dark {
+  color: rgba(255, 255, 255, 0.7) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-secondary-on-dark, rgba(255, 255, 255, 0.7)) !important; }
+
+.mdc-theme--text-hint-on-dark {
+  color: rgba(255, 255, 255, 0.5) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-hint-on-dark, rgba(255, 255, 255, 0.5)) !important; }
+
+.mdc-theme--text-disabled-on-dark {
+  color: rgba(255, 255, 255, 0.5) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-disabled-on-dark, rgba(255, 255, 255, 0.5)) !important; }
+
+.mdc-theme--text-icon-on-dark {
+  color: rgba(255, 255, 255, 0.5) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-icon-on-dark, rgba(255, 255, 255, 0.5)) !important; }
+
+.mdc-theme--primary-bg {
+  background-color: #6200ee !important;
+  /* @alternate */
+  background-color: var(--mdc-theme-primary, #6200ee) !important; }
+
+.mdc-theme--secondary-bg {
+  background-color: #018786 !important;
+  /* @alternate */
+  background-color: var(--mdc-theme-secondary, #018786) !important; }
+
+/*# sourceMappingURL=mdc.theme.css.map*/
\ No newline at end of file
diff --git a/node_modules/@material/.notched-outline.MODULES/@material/theme/dist/mdc.theme.min.css b/node_modules/@material/.notched-outline.MODULES/@material/theme/dist/mdc.theme.min.css
new file mode 100644
index 0000000..88b38e2
--- /dev/null
+++ b/node_modules/@material/.notched-outline.MODULES/@material/theme/dist/mdc.theme.min.css
@@ -0,0 +1,8 @@
+/*!
+ Material Components for the Web
+ Copyright (c) 2018 Google Inc.
+ License: Apache-2.0
+*/
+:root{--mdc-theme-primary: #6200ee;--mdc-theme-secondary: #018786;--mdc-theme-background: #fff;--mdc-theme-surface: #fff;--mdc-theme-on-primary: #fff;--mdc-theme-on-secondary: #fff;--mdc-theme-on-surface: #000;--mdc-theme-text-primary-on-background: rgba(0,0,0,0.87);--mdc-theme-text-secondary-on-background: rgba(0,0,0,0.54);--mdc-theme-text-hint-on-background: rgba(0,0,0,0.38);--mdc-theme-text-disabled-on-background: rgba(0,0,0,0.38);--mdc-theme-text-icon-on-background: rgba(0,0,0,0.38);--mdc-theme-text-primary-on-light: rgba(0,0,0,0.87);--mdc-theme-text-secondary-on-light: rgba(0,0,0,0.54);--mdc-theme-text-hint-on-light: rgba(0,0,0,0.38);--mdc-theme-text-disabled-on-light: rgba(0,0,0,0.38);--mdc-theme-text-icon-on-light: rgba(0,0,0,0.38);--mdc-theme-text-primary-on-dark: #fff;--mdc-theme-text-secondary-on-dark: rgba(255,255,255,0.7);--mdc-theme-text-hint-on-dark: rgba(255,255,255,0.5);--mdc-theme-text-disabled-on-dark: rgba(255,255,255,0.5);--mdc-theme-text-icon-on-dark: rgba(255,255,255,0.5)}.mdc-theme--primary{color:#6200ee !important;color:var(--mdc-theme-primary, #6200ee) !important}.mdc-theme--secondary{color:#018786 !important;color:var(--mdc-theme-secondary, #018786) !important}.mdc-theme--background{background-color:#fff;background-color:var(--mdc-theme-background, #fff)}.mdc-theme--surface{background-color:#fff;background-color:var(--mdc-theme-surface, #fff)}.mdc-theme--on-primary{color:#fff !important;color:var(--mdc-theme-on-primary, #fff) !important}.mdc-theme--on-secondary{color:#fff !important;color:var(--mdc-theme-on-secondary, #fff) !important}.mdc-theme--on-surface{color:#000 !important;color:var(--mdc-theme-on-surface, #000) !important}.mdc-theme--text-primary-on-background{color:rgba(0,0,0,0.87) !important;color:var(--mdc-theme-text-primary-on-background, rgba(0,0,0,0.87)) !important}.mdc-theme--text-secondary-on-background{color:rgba(0,0,0,0.54) !important;color:var(--mdc-theme-text-secondary-on-background, rgba(0,0,0,0.54)) !important}.mdc-theme--text-hint-on-background{color:rgba(0,0,0,0.38) !important;color:var(--mdc-theme-text-hint-on-background, rgba(0,0,0,0.38)) !important}.mdc-theme--text-disabled-on-background{color:rgba(0,0,0,0.38) !important;color:var(--mdc-theme-text-disabled-on-background, rgba(0,0,0,0.38)) !important}.mdc-theme--text-icon-on-background{color:rgba(0,0,0,0.38) !important;color:var(--mdc-theme-text-icon-on-background, rgba(0,0,0,0.38)) !important}.mdc-theme--text-primary-on-light{color:rgba(0,0,0,0.87) !important;color:var(--mdc-theme-text-primary-on-light, rgba(0,0,0,0.87)) !important}.mdc-theme--text-secondary-on-light{color:rgba(0,0,0,0.54) !important;color:var(--mdc-theme-text-secondary-on-light, rgba(0,0,0,0.54)) !important}.mdc-theme--text-hint-on-light{color:rgba(0,0,0,0.38) !important;color:var(--mdc-theme-text-hint-on-light, rgba(0,0,0,0.38)) !important}.mdc-theme--text-disabled-on-light{color:rgba(0,0,0,0.38) !important;color:var(--mdc-theme-text-disabled-on-light, rgba(0,0,0,0.38)) !important}.mdc-theme--text-icon-on-light{color:rgba(0,0,0,0.38) !important;color:var(--mdc-theme-text-icon-on-light, rgba(0,0,0,0.38)) !important}.mdc-theme--text-primary-on-dark{color:#fff !important;color:var(--mdc-theme-text-primary-on-dark, #fff) !important}.mdc-theme--text-secondary-on-dark{color:rgba(255,255,255,0.7) !important;color:var(--mdc-theme-text-secondary-on-dark, rgba(255,255,255,0.7)) !important}.mdc-theme--text-hint-on-dark{color:rgba(255,255,255,0.5) !important;color:var(--mdc-theme-text-hint-on-dark, rgba(255,255,255,0.5)) !important}.mdc-theme--text-disabled-on-dark{color:rgba(255,255,255,0.5) !important;color:var(--mdc-theme-text-disabled-on-dark, rgba(255,255,255,0.5)) !important}.mdc-theme--text-icon-on-dark{color:rgba(255,255,255,0.5) !important;color:var(--mdc-theme-text-icon-on-dark, rgba(255,255,255,0.5)) !important}.mdc-theme--primary-bg{background-color:#6200ee !important;background-color:var(--mdc-theme-primary, #6200ee) !important}.mdc-theme--secondary-bg{background-color:#018786 !important;background-color:var(--mdc-theme-secondary, #018786) !important}
+
+/*# sourceMappingURL=mdc.theme.min.css.map*/
\ No newline at end of file
diff --git a/node_modules/@material/.notched-outline.MODULES/@material/theme/mdc-theme.scss b/node_modules/@material/.notched-outline.MODULES/@material/theme/mdc-theme.scss
new file mode 100644
index 0000000..759aae8
--- /dev/null
+++ b/node_modules/@material/.notched-outline.MODULES/@material/theme/mdc-theme.scss
@@ -0,0 +1,42 @@
+//
+// Copyright 2017 Google Inc. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+@import "./mixins";
+
+:root {
+  @each $style in map-keys($mdc-theme-property-values) {
+    --mdc-theme-#{$style}: #{map-get($mdc-theme-property-values, $style)};
+  }
+}
+
+@each $style in map-keys($mdc-theme-property-values) {
+  @if $style != "background" and $style != "surface" {
+    .mdc-theme--#{$style} {
+      @include mdc-theme-prop(color, $style, true);
+    }
+  } @else {
+    .mdc-theme--#{$style} {
+      @include mdc-theme-prop(background-color, $style);
+    }
+  }
+}
+
+// CSS rules for using primary and secondary (plus light/dark variants) as background colors.
+@each $style in ("primary", "secondary") {
+  .mdc-theme--#{$style}-bg {
+    @include mdc-theme-prop(background-color, $style, true);
+  }
+}
diff --git a/node_modules/@material/.notched-outline.MODULES/@material/theme/package.json b/node_modules/@material/.notched-outline.MODULES/@material/theme/package.json
new file mode 100644
index 0000000..c12a489
--- /dev/null
+++ b/node_modules/@material/.notched-outline.MODULES/@material/theme/package.json
@@ -0,0 +1,45 @@
+{
+  "_from": "@material/theme@^0.38.0",
+  "_id": "@material/theme@0.38.0",
+  "_inBundle": false,
+  "_integrity": "sha512-mP5+qgICPm/0dD3hKa/hMd8AHerkAaLJgEsvBwTXi+N/kpPo9LIrHg40DvUGPs5w6KD9PUuskb3WGBvYcToHvA==",
+  "_location": "/@material/notched-outline/@material/theme",
+  "_phantomChildren": {},
+  "_requested": {
+    "type": "range",
+    "registry": true,
+    "raw": "@material/theme@^0.38.0",
+    "name": "@material/theme",
+    "escapedName": "@material%2ftheme",
+    "scope": "@material",
+    "rawSpec": "^0.38.0",
+    "saveSpec": null,
+    "fetchSpec": "^0.38.0"
+  },
+  "_requiredBy": [
+    "/@material/notched-outline"
+  ],
+  "_resolved": "https://registry.npmjs.org/@material/theme/-/theme-0.38.0.tgz",
+  "_shasum": "c1a2247eba4af2ba47da4456921ab420869fda55",
+  "_spec": "@material/theme@^0.38.0",
+  "_where": "C:\\Users\\jakch\\github\\tool-hub\\node_modules\\@material\\notched-outline",
+  "bugs": {
+    "url": "https://github.com/material-components/material-components-web/issues"
+  },
+  "bundleDependencies": false,
+  "deprecated": false,
+  "description": "The Material Components for the web theming system",
+  "homepage": "https://github.com/material-components/material-components-web#readme",
+  "keywords": [
+    "material components",
+    "material design",
+    "theme"
+  ],
+  "license": "Apache-2.0",
+  "name": "@material/theme",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/material-components/material-components-web.git"
+  },
+  "version": "0.38.0"
+}
diff --git a/node_modules/@material/floating-label/README.md b/node_modules/@material/floating-label/README.md
new file mode 100644
index 0000000..41d06fe
--- /dev/null
+++ b/node_modules/@material/floating-label/README.md
@@ -0,0 +1,110 @@
+<!--docs:
+title: "Floating Label"
+layout: detail
+section: components
+excerpt: "An animated text caption for a Text Field or Select."
+path: /catalog/input-controls/floating-label/
+-->
+
+# Floating Label
+
+Floating labels display the type of input a field requires. Every Text Field and Select should have a label, except for full-width text fields, which use the input's `placeholder` attribute instead. Labels are aligned with the input line and always visible. They can be resting (when a field is inactive and empty) or floating. The label is a text caption or description for the Text Field.
+
+## Design & API Documentation
+
+<ul class="icon-list">
+  <li class="icon-list-item icon-list-item--spec">
+    <a href="https://material.io/go/design-text-fields#text-fields-layout">Material Design guidelines: Text Fields Layout</a>
+  </li>
+  <li class="icon-list-item icon-list-item--spec">
+    <a href="https://material-components.github.io/material-components-web-catalog/#/component/text-field">Demo with Text Field</a>
+  </li>
+</ul>
+
+## Basic Usage
+
+### HTML Structure
+
+```html
+<label class="mdc-floating-label" for="my-text-field-id">Hint text</label>
+```
+
+### Styles
+
+```scss
+@import "@material/floating-label/mdc-floating-label";
+```
+
+### JavaScript Instantiation
+
+```js
+import {MDCFloatingLabel} from '@material/floating-label';
+
+const floatingLabel = new MDCFloatingLabel(document.querySelector('.mdc-floating-label'));
+```
+
+## Variants
+
+### Avoid Dynamic ID Generation
+
+If you're using the JavaScript-enabled version of floating label, you can avoid needing to assign
+a unique `id` to each `<input>` by wrapping `mdc-text-field__input` within a `<label>`:
+
+```html
+<label class="mdc-text-field">
+  <input type="text" class="mdc-text-field__input">
+  <span class="mdc-floating-label">Hint Text</span>
+  <div class="mdc-text-field__bottom-line"></div>
+</label>
+```
+
+> NOTE: This method also works with `<select>`.
+
+## Style Customization
+
+### CSS Classes
+
+CSS Class | Description
+--- | ---
+`mdc-floating-label` | Mandatory.
+`mdc-floating-label--float-above` | Indicates the label is floating in the floating position.
+`mdc-floating-label--shake` | Shakes the label.
+
+### Sass Mixins
+
+Mixin | Description
+--- | ---
+`mdc-floating-label-ink-color($color)` | Customizes the ink color of the label.
+`mdc-floating-label-fill-color($color)` | Customizes the fill color of the label.
+`mdc-floating-label-shake-keyframes($modifier, $positionY, $positionX, $scale)` | Generates a CSS `@keyframes` at-rule for an invalid label shake. Used in conjunction with the `mdc-floating-label-shake-animation` mixin.
+`mdc-floating-label-shake-animation($modifier)` | Applies shake keyframe animation to label.
+`mdc-floating-label-float-position($positionY, $positionX, $scale)` | Sets position of label when floating.
+`mdc-floating-label-max-width($max-width)` | Sets the max width of the label.
+
+## `MDCFloatingLabel` Properties and Methods
+
+Method Signature | Description
+--- | ---
+`shake(shouldShake: boolean) => void` | Proxies to the foundation's `shake()` method.
+`float(shouldFloat: boolean) => void` | Proxies to the foundation's `float()` method.
+`getWidth() => number` | Proxies to the foundation's `getWidth()` method.
+
+## Usage Within Frameworks
+
+If you are using a JavaScript framework, such as React or Angular, you can create a Floating Label for your framework. Depending on your needs, you can use the _Simple Approach: Wrapping MDC Web Vanilla Components_, or the _Advanced Approach: Using Foundations and Adapters_. Please follow the instructions [here](../../docs/integrating-into-frameworks.md).
+
+### `MDCFloatingLabelAdapter`
+
+Method Signature | Description
+--- | ---
+`addClass(className: string) => void` | Adds a class to the label element.
+`removeClass(className: string) => void` | Removes a class from the label element.
+`getWidth() => number` | Returns the width of the label element.
+
+### `MDCFloatingLabelFoundation`
+
+Method Signature | Description
+--- | ---
+`shake(shouldShake: boolean)` | Shakes or stops shaking the label, depending on the value of `shouldShake`.
+`float(shouldFloat: boolean)` | Floats or docks the label, depending on the value of `shouldFloat`.
+`getWidth() => number` | Returns the width of the label element.
diff --git a/node_modules/@material/floating-label/_mixins.scss b/node_modules/@material/floating-label/_mixins.scss
new file mode 100644
index 0000000..bc7b35c
--- /dev/null
+++ b/node_modules/@material/floating-label/_mixins.scss
@@ -0,0 +1,73 @@
+//
+// Copyright 2018 Google Inc. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+@import "@material/rtl/mixins";
+@import "./variables";
+
+@mixin mdc-floating-label-ink-color($color) {
+  @include mdc-theme-prop(color, $color);
+}
+
+// Used for textarea in case of scrolling
+@mixin mdc-floating-label-fill-color($color) {
+  @include mdc-theme-prop(background-color, $color);
+}
+
+@mixin mdc-floating-label-shake-keyframes($modifier, $positionY, $positionX: 0%, $scale: .75) {
+  @keyframes mdc-floating-label-shake-float-above-#{$modifier} {
+    0% {
+      transform: translateX(calc(0 - #{$positionX})) translateY(-#{$positionY}) scale(#{$scale});
+    }
+
+    33% {
+      animation-timing-function: cubic-bezier(.5, 0, .701732, .495819);
+      transform: translateX(calc(4% - #{$positionX})) translateY(-#{$positionY}) scale(#{$scale});
+    }
+
+    66% {
+      animation-timing-function: cubic-bezier(.302435, .381352, .55, .956352);
+      transform: translateX(calc(-4% - #{$positionX})) translateY(-#{$positionY}) scale(#{$scale});
+    }
+
+    100% {
+      transform: translateX(calc(0 - #{$positionX})) translateY(-#{$positionY}) scale(#{$scale});
+    }
+  }
+}
+
+@mixin mdc-floating-label-float-position($positionY, $positionX: 0%, $scale: .75) {
+  .mdc-floating-label--float-above {
+    @if $positionX == 0 {
+      transform: translateY(-1 * $positionY) scale($scale);
+    } @else {
+      transform: translateY(-1 * $positionY) translateX(-1 * $positionX) scale($scale);
+
+      @include mdc-rtl {
+        transform: translateY(-1 * $positionY) translateX($positionX) scale($scale);
+      }
+    }
+  }
+}
+
+@mixin mdc-floating-label-shake-animation($modifier) {
+  .mdc-floating-label--shake {
+    animation: mdc-floating-label-shake-float-above-#{$modifier} 250ms 1;
+  }
+}
+
+@mixin mdc-floating-label-max-width($max-width) {
+  max-width: $max-width;
+}
diff --git a/node_modules/@material/floating-label/_variables.scss b/node_modules/@material/floating-label/_variables.scss
new file mode 100644
index 0000000..3c5389a
--- /dev/null
+++ b/node_modules/@material/floating-label/_variables.scss
@@ -0,0 +1,18 @@
+//
+// Copyright 2018 Google Inc. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+$mdc-floating-label-position-y: 100%;
+$mdc-floating-label-transition-duration: 150ms;
diff --git a/node_modules/@material/floating-label/adapter.js b/node_modules/@material/floating-label/adapter.js
new file mode 100644
index 0000000..caeba75
--- /dev/null
+++ b/node_modules/@material/floating-label/adapter.js
@@ -0,0 +1,64 @@
+/**
+ * @license
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/* eslint no-unused-vars: [2, {"args": "none"}] */
+
+/**
+ * Adapter for MDC Floating Label.
+ *
+ * Defines the shape of the adapter expected by the foundation. Implement this
+ * adapter to integrate the floating label into your framework. See
+ * https://github.com/material-components/material-components-web/blob/master/docs/authoring-components.md
+ * for more information.
+ *
+ * @record
+ */
+class MDCFloatingLabelAdapter {
+  /**
+   * Adds a class to the label element.
+   * @param {string} className
+   */
+  addClass(className) {}
+
+  /**
+   * Removes a class from the label element.
+   * @param {string} className
+   */
+  removeClass(className) {}
+
+  /**
+   * Returns the width of the label element.
+   * @return {number}
+   */
+  getWidth() {}
+
+  /**
+   * Registers an event listener on the root element for a given event.
+   * @param {string} evtType
+   * @param {function(!Event): undefined} handler
+   */
+  registerInteractionHandler(evtType, handler) {}
+
+  /**
+   * Deregisters an event listener on the root element for a given event.
+   * @param {string} evtType
+   * @param {function(!Event): undefined} handler
+   */
+  deregisterInteractionHandler(evtType, handler) {}
+}
+
+export default MDCFloatingLabelAdapter;
diff --git a/node_modules/@material/floating-label/constants.js b/node_modules/@material/floating-label/constants.js
new file mode 100644
index 0000000..789db67
--- /dev/null
+++ b/node_modules/@material/floating-label/constants.js
@@ -0,0 +1,24 @@
+/**
+ * @license
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/** @enum {string} */
+const cssClasses = {
+  LABEL_FLOAT_ABOVE: 'mdc-floating-label--float-above',
+  LABEL_SHAKE: 'mdc-floating-label--shake',
+};
+
+export {cssClasses};
diff --git a/node_modules/@material/floating-label/dist/mdc.floating-label.css b/node_modules/@material/floating-label/dist/mdc.floating-label.css
new file mode 100644
index 0000000..a6c7416
--- /dev/null
+++ b/node_modules/@material/floating-label/dist/mdc.floating-label.css
@@ -0,0 +1,86 @@
+/*!
+ Material Components for the Web
+ Copyright (c) 2018 Google Inc.
+ License: Apache-2.0
+*/
+.mdc-floating-label {
+  font-family: Roboto, sans-serif;
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-font-smoothing: antialiased;
+  font-size: 1rem;
+  line-height: 1.75rem;
+  font-weight: 400;
+  letter-spacing: 0.00937em;
+  text-decoration: inherit;
+  text-transform: inherit;
+  position: absolute;
+  bottom: 8px;
+  left: 0;
+  -webkit-transform-origin: left top;
+          transform-origin: left top;
+  transition: color 150ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 150ms cubic-bezier(0.4, 0, 0.2, 1);
+  transition: transform 150ms cubic-bezier(0.4, 0, 0.2, 1), color 150ms cubic-bezier(0.4, 0, 0.2, 1);
+  transition: transform 150ms cubic-bezier(0.4, 0, 0.2, 1), color 150ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 150ms cubic-bezier(0.4, 0, 0.2, 1);
+  line-height: 1.15rem;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  cursor: text;
+  overflow: hidden;
+  will-change: transform; }
+  [dir="rtl"] .mdc-floating-label, .mdc-floating-label[dir="rtl"] {
+    /* @noflip */
+    right: 0;
+    /* @noflip */
+    left: auto;
+    /* @noflip */
+    -webkit-transform-origin: right top;
+            transform-origin: right top; }
+
+.mdc-floating-label--float-above {
+  cursor: auto; }
+
+.mdc-floating-label--float-above {
+  -webkit-transform: translateY(-100%) scale(0.75);
+          transform: translateY(-100%) scale(0.75); }
+
+.mdc-floating-label--shake {
+  -webkit-animation: mdc-floating-label-shake-float-above-standard 250ms 1;
+          animation: mdc-floating-label-shake-float-above-standard 250ms 1; }
+
+@-webkit-keyframes mdc-floating-label-shake-float-above-standard {
+  0% {
+    -webkit-transform: translateX(calc(0 - 0%)) translateY(-100%) scale(0.75);
+            transform: translateX(calc(0 - 0%)) translateY(-100%) scale(0.75); }
+  33% {
+    -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582);
+            animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582);
+    -webkit-transform: translateX(calc(4% - 0%)) translateY(-100%) scale(0.75);
+            transform: translateX(calc(4% - 0%)) translateY(-100%) scale(0.75); }
+  66% {
+    -webkit-animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);
+            animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);
+    -webkit-transform: translateX(calc(-4% - 0%)) translateY(-100%) scale(0.75);
+            transform: translateX(calc(-4% - 0%)) translateY(-100%) scale(0.75); }
+  100% {
+    -webkit-transform: translateX(calc(0 - 0%)) translateY(-100%) scale(0.75);
+            transform: translateX(calc(0 - 0%)) translateY(-100%) scale(0.75); } }
+
+@keyframes mdc-floating-label-shake-float-above-standard {
+  0% {
+    -webkit-transform: translateX(calc(0 - 0%)) translateY(-100%) scale(0.75);
+            transform: translateX(calc(0 - 0%)) translateY(-100%) scale(0.75); }
+  33% {
+    -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582);
+            animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582);
+    -webkit-transform: translateX(calc(4% - 0%)) translateY(-100%) scale(0.75);
+            transform: translateX(calc(4% - 0%)) translateY(-100%) scale(0.75); }
+  66% {
+    -webkit-animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);
+            animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);
+    -webkit-transform: translateX(calc(-4% - 0%)) translateY(-100%) scale(0.75);
+            transform: translateX(calc(-4% - 0%)) translateY(-100%) scale(0.75); }
+  100% {
+    -webkit-transform: translateX(calc(0 - 0%)) translateY(-100%) scale(0.75);
+            transform: translateX(calc(0 - 0%)) translateY(-100%) scale(0.75); } }
+
+/*# sourceMappingURL=mdc.floating-label.css.map*/
\ No newline at end of file
diff --git a/node_modules/@material/floating-label/dist/mdc.floating-label.min.css b/node_modules/@material/floating-label/dist/mdc.floating-label.min.css
new file mode 100644
index 0000000..db0b6dd
--- /dev/null
+++ b/node_modules/@material/floating-label/dist/mdc.floating-label.min.css
@@ -0,0 +1,8 @@
+/*!
+ Material Components for the Web
+ Copyright (c) 2018 Google Inc.
+ License: Apache-2.0
+*/
+.mdc-floating-label{font-family:Roboto,sans-serif;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-size:1rem;line-height:1.75rem;font-weight:400;letter-spacing:.00937em;text-decoration:inherit;text-transform:inherit;position:absolute;bottom:8px;left:0;-webkit-transform-origin:left top;transform-origin:left top;transition:color 150ms cubic-bezier(0.4, 0, 0.2, 1),-webkit-transform 150ms cubic-bezier(0.4, 0, 0.2, 1);transition:transform 150ms cubic-bezier(0.4, 0, 0.2, 1),color 150ms cubic-bezier(0.4, 0, 0.2, 1);transition:transform 150ms cubic-bezier(0.4, 0, 0.2, 1),color 150ms cubic-bezier(0.4, 0, 0.2, 1),-webkit-transform 150ms cubic-bezier(0.4, 0, 0.2, 1);line-height:1.15rem;text-overflow:ellipsis;white-space:nowrap;cursor:text;overflow:hidden;will-change:transform}[dir="rtl"] .mdc-floating-label,.mdc-floating-label[dir="rtl"]{right:0;left:auto;-webkit-transform-origin:right top;transform-origin:right top}.mdc-floating-label--float-above{cursor:auto}.mdc-floating-label--float-above{-webkit-transform:translateY(-100%) scale(.75);transform:translateY(-100%) scale(.75)}.mdc-floating-label--shake{-webkit-animation:mdc-floating-label-shake-float-above-standard 250ms 1;animation:mdc-floating-label-shake-float-above-standard 250ms 1}@-webkit-keyframes mdc-floating-label-shake-float-above-standard{0%{-webkit-transform:translateX(calc(0 - 0%)) translateY(-100%) scale(.75);transform:translateX(calc(0 - 0%)) translateY(-100%) scale(.75)}33%{-webkit-animation-timing-function:cubic-bezier(0.5, 0, 0.70173, 0.49582);animation-timing-function:cubic-bezier(0.5, 0, 0.70173, 0.49582);-webkit-transform:translateX(calc(4% - 0%)) translateY(-100%) scale(.75);transform:translateX(calc(4% - 0%)) translateY(-100%) scale(.75)}66%{-webkit-animation-timing-function:cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);animation-timing-function:cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);-webkit-transform:translateX(calc(-4% - 0%)) translateY(-100%) scale(.75);transform:translateX(calc(-4% - 0%)) translateY(-100%) scale(.75)}100%{-webkit-transform:translateX(calc(0 - 0%)) translateY(-100%) scale(.75);transform:translateX(calc(0 - 0%)) translateY(-100%) scale(.75)}}@keyframes mdc-floating-label-shake-float-above-standard{0%{-webkit-transform:translateX(calc(0 - 0%)) translateY(-100%) scale(.75);transform:translateX(calc(0 - 0%)) translateY(-100%) scale(.75)}33%{-webkit-animation-timing-function:cubic-bezier(0.5, 0, 0.70173, 0.49582);animation-timing-function:cubic-bezier(0.5, 0, 0.70173, 0.49582);-webkit-transform:translateX(calc(4% - 0%)) translateY(-100%) scale(.75);transform:translateX(calc(4% - 0%)) translateY(-100%) scale(.75)}66%{-webkit-animation-timing-function:cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);animation-timing-function:cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);-webkit-transform:translateX(calc(-4% - 0%)) translateY(-100%) scale(.75);transform:translateX(calc(-4% - 0%)) translateY(-100%) scale(.75)}100%{-webkit-transform:translateX(calc(0 - 0%)) translateY(-100%) scale(.75);transform:translateX(calc(0 - 0%)) translateY(-100%) scale(.75)}}
+
+/*# sourceMappingURL=mdc.floating-label.min.css.map*/
\ No newline at end of file
diff --git a/node_modules/@material/floating-label/dist/mdc.floatingLabel.js b/node_modules/@material/floating-label/dist/mdc.floatingLabel.js
new file mode 100644
index 0000000..386fe8d
--- /dev/null
+++ b/node_modules/@material/floating-label/dist/mdc.floatingLabel.js
@@ -0,0 +1,797 @@
+/*!
+ Material Components for the Web
+ Copyright (c) 2018 Google Inc.
+ License: Apache-2.0
+*/
+(function webpackUniversalModuleDefinition(root, factory) {
+	if(typeof exports === 'object' && typeof module === 'object')
+		module.exports = factory();
+	else if(typeof define === 'function' && define.amd)
+		define([], factory);
+	else if(typeof exports === 'object')
+		exports["floatingLabel"] = factory();
+	else
+		root["mdc"] = root["mdc"] || {}, root["mdc"]["floatingLabel"] = factory();
+})(this, function() {
+return /******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, {
+/******/ 				configurable: false,
+/******/ 				enumerable: true,
+/******/ 				get: getter
+/******/ 			});
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "";
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = 19);
+/******/ })
+/************************************************************************/
+/******/ ({
+
+/***/ 0:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * @license
+ * Copyright 2016 Google Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * @template A
+ */
+var MDCFoundation = function () {
+  _createClass(MDCFoundation, null, [{
+    key: "cssClasses",
+
+    /** @return enum{cssClasses} */
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports every
+      // CSS class the foundation class needs as a property. e.g. {ACTIVE: 'mdc-component--active'}
+      return {};
+    }
+
+    /** @return enum{strings} */
+
+  }, {
+    key: "strings",
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports all
+      // semantic strings as constants. e.g. {ARIA_ROLE: 'tablist'}
+      return {};
+    }
+
+    /** @return enum{numbers} */
+
+  }, {
+    key: "numbers",
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports all
+      // of its semantic numbers as constants. e.g. {ANIMATION_DELAY_MS: 350}
+      return {};
+    }
+
+    /** @return {!Object} */
+
+  }, {
+    key: "defaultAdapter",
+    get: function get() {
+      // Classes extending MDCFoundation may choose to implement this getter in order to provide a convenient
+      // way of viewing the necessary methods of an adapter. In the future, this could also be used for adapter
+      // validation.
+      return {};
+    }
+
+    /**
+     * @param {A=} adapter
+     */
+
+  }]);
+
+  function MDCFoundation() {
+    var adapter = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+
+    _classCallCheck(this, MDCFoundation);
+
+    /** @protected {!A} */
+    this.adapter_ = adapter;
+  }
+
+  _createClass(MDCFoundation, [{
+    key: "init",
+    value: function init() {
+      // Subclasses should override this method to perform initialization routines (registering events, etc.)
+    }
+  }, {
+    key: "destroy",
+    value: function destroy() {
+      // Subclasses should override this method to perform de-initialization routines (de-registering events, etc.)
+    }
+  }]);
+
+  return MDCFoundation;
+}();
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCFoundation);
+
+/***/ }),
+
+/***/ 1:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__foundation__ = __webpack_require__(0);
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * @license
+ * Copyright 2016 Google Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+/**
+ * @template F
+ */
+
+var MDCComponent = function () {
+  _createClass(MDCComponent, null, [{
+    key: 'attachTo',
+
+    /**
+     * @param {!Element} root
+     * @return {!MDCComponent}
+     */
+    value: function attachTo(root) {
+      // Subclasses which extend MDCBase should provide an attachTo() method that takes a root element and
+      // returns an instantiated component with its root set to that element. Also note that in the cases of
+      // subclasses, an explicit foundation class will not have to be passed in; it will simply be initialized
+      // from getDefaultFoundation().
+      return new MDCComponent(root, new __WEBPACK_IMPORTED_MODULE_0__foundation__["a" /* default */]());
+    }
+
+    /**
+     * @param {!Element} root
+     * @param {F=} foundation
+     * @param {...?} args
+     */
+
+  }]);
+
+  function MDCComponent(root) {
+    var foundation = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : undefined;
+
+    _classCallCheck(this, MDCComponent);
+
+    /** @protected {!Element} */
+    this.root_ = root;
+
+    for (var _len = arguments.length, args = Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++) {
+      args[_key - 2] = arguments[_key];
+    }
+
+    this.initialize.apply(this, args);
+    // Note that we initialize foundation here and not within the constructor's default param so that
+    // this.root_ is defined and can be used within the foundation class.
+    /** @protected {!F} */
+    this.foundation_ = foundation === undefined ? this.getDefaultFoundation() : foundation;
+    this.foundation_.init();
+    this.initialSyncWithDOM();
+  }
+
+  _createClass(MDCComponent, [{
+    key: 'initialize',
+    value: function initialize() /* ...args */{}
+    // Subclasses can override this to do any additional setup work that would be considered part of a
+    // "constructor". Essentially, it is a hook into the parent constructor before the foundation is
+    // initialized. Any additional arguments besides root and foundation will be passed in here.
+
+
+    /**
+     * @return {!F} foundation
+     */
+
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      // Subclasses must override this method to return a properly configured foundation class for the
+      // component.
+      throw new Error('Subclasses must override getDefaultFoundation to return a properly configured ' + 'foundation class');
+    }
+  }, {
+    key: 'initialSyncWithDOM',
+    value: function initialSyncWithDOM() {
+      // Subclasses should override this method if they need to perform work to synchronize with a host DOM
+      // object. An example of this would be a form control wrapper that needs to synchronize its internal state
+      // to some property or attribute of the host DOM. Please note: this is *not* the place to perform DOM
+      // reads/writes that would cause layout / paint, as this is called synchronously from within the constructor.
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      // Subclasses may implement this method to release any resources / deregister any listeners they have
+      // attached. An example of this might be deregistering a resize event from the window object.
+      this.foundation_.destroy();
+    }
+
+    /**
+     * Wrapper method to add an event listener to the component's root element. This is most useful when
+     * listening for custom events.
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: 'listen',
+    value: function listen(evtType, handler) {
+      this.root_.addEventListener(evtType, handler);
+    }
+
+    /**
+     * Wrapper method to remove an event listener to the component's root element. This is most useful when
+     * unlistening for custom events.
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: 'unlisten',
+    value: function unlisten(evtType, handler) {
+      this.root_.removeEventListener(evtType, handler);
+    }
+
+    /**
+     * Fires a cross-browser-compatible custom event from the component root of the given type,
+     * with the given data.
+     * @param {string} evtType
+     * @param {!Object} evtData
+     * @param {boolean=} shouldBubble
+     */
+
+  }, {
+    key: 'emit',
+    value: function emit(evtType, evtData) {
+      var shouldBubble = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
+
+      var evt = void 0;
+      if (typeof CustomEvent === 'function') {
+        evt = new CustomEvent(evtType, {
+          detail: evtData,
+          bubbles: shouldBubble
+        });
+      } else {
+        evt = document.createEvent('CustomEvent');
+        evt.initCustomEvent(evtType, shouldBubble, false, evtData);
+      }
+
+      this.root_.dispatchEvent(evt);
+    }
+  }]);
+
+  return MDCComponent;
+}();
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCComponent);
+
+/***/ }),
+
+/***/ 13:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * @license
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/* eslint no-unused-vars: [2, {"args": "none"}] */
+
+/**
+ * Adapter for MDC Floating Label.
+ *
+ * Defines the shape of the adapter expected by the foundation. Implement this
+ * adapter to integrate the floating label into your framework. See
+ * https://github.com/material-components/material-components-web/blob/master/docs/authoring-components.md
+ * for more information.
+ *
+ * @record
+ */
+var MDCFloatingLabelAdapter = function () {
+  function MDCFloatingLabelAdapter() {
+    _classCallCheck(this, MDCFloatingLabelAdapter);
+  }
+
+  _createClass(MDCFloatingLabelAdapter, [{
+    key: "addClass",
+
+    /**
+     * Adds a class to the label element.
+     * @param {string} className
+     */
+    value: function addClass(className) {}
+
+    /**
+     * Removes a class from the label element.
+     * @param {string} className
+     */
+
+  }, {
+    key: "removeClass",
+    value: function removeClass(className) {}
+
+    /**
+     * Returns the width of the label element.
+     * @return {number}
+     */
+
+  }, {
+    key: "getWidth",
+    value: function getWidth() {}
+
+    /**
+     * Registers an event listener on the root element for a given event.
+     * @param {string} evtType
+     * @param {function(!Event): undefined} handler
+     */
+
+  }, {
+    key: "registerInteractionHandler",
+    value: function registerInteractionHandler(evtType, handler) {}
+
+    /**
+     * Deregisters an event listener on the root element for a given event.
+     * @param {string} evtType
+     * @param {function(!Event): undefined} handler
+     */
+
+  }, {
+    key: "deregisterInteractionHandler",
+    value: function deregisterInteractionHandler(evtType, handler) {}
+  }]);
+
+  return MDCFloatingLabelAdapter;
+}();
+
+/* unused harmony default export */ var _unused_webpack_default_export = (MDCFloatingLabelAdapter);
+
+/***/ }),
+
+/***/ 19:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MDCFloatingLabel", function() { return MDCFloatingLabel; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_component__ = __webpack_require__(1);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__adapter__ = __webpack_require__(13);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__foundation__ = __webpack_require__(20);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCFloatingLabelFoundation", function() { return __WEBPACK_IMPORTED_MODULE_2__foundation__["a"]; });
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * @license
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+/**
+ * @extends {MDCComponent<!MDCFloatingLabelFoundation>}
+ * @final
+ */
+
+var MDCFloatingLabel = function (_MDCComponent) {
+  _inherits(MDCFloatingLabel, _MDCComponent);
+
+  function MDCFloatingLabel() {
+    _classCallCheck(this, MDCFloatingLabel);
+
+    return _possibleConstructorReturn(this, (MDCFloatingLabel.__proto__ || Object.getPrototypeOf(MDCFloatingLabel)).apply(this, arguments));
+  }
+
+  _createClass(MDCFloatingLabel, [{
+    key: 'shake',
+
+
+    /**
+     * Styles the label to produce the label shake for errors.
+     * @param {boolean} shouldShake styles the label to shake by adding shake class
+     * if true, otherwise will stop shaking by removing shake class.
+     */
+    value: function shake(shouldShake) {
+      this.foundation_.shake(shouldShake);
+    }
+
+    /**
+     * Styles label to float/dock.
+     * @param {boolean} shouldFloat styles the label to float by adding float class
+     * if true, otherwise docks the label by removing the float class.
+     */
+
+  }, {
+    key: 'float',
+    value: function float(shouldFloat) {
+      this.foundation_.float(shouldFloat);
+    }
+
+    /**
+     * @return {number}
+     */
+
+  }, {
+    key: 'getWidth',
+    value: function getWidth() {
+      return this.foundation_.getWidth();
+    }
+
+    /**
+     * @return {!MDCFloatingLabelFoundation}
+     */
+
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      var _this2 = this;
+
+      return new __WEBPACK_IMPORTED_MODULE_2__foundation__["a" /* default */]({
+        addClass: function addClass(className) {
+          return _this2.root_.classList.add(className);
+        },
+        removeClass: function removeClass(className) {
+          return _this2.root_.classList.remove(className);
+        },
+        getWidth: function getWidth() {
+          return _this2.root_.offsetWidth;
+        },
+        registerInteractionHandler: function registerInteractionHandler(evtType, handler) {
+          return _this2.root_.addEventListener(evtType, handler);
+        },
+        deregisterInteractionHandler: function deregisterInteractionHandler(evtType, handler) {
+          return _this2.root_.removeEventListener(evtType, handler);
+        }
+      });
+    }
+  }], [{
+    key: 'attachTo',
+
+    /**
+     * @param {!Element} root
+     * @return {!MDCFloatingLabel}
+     */
+    value: function attachTo(root) {
+      return new MDCFloatingLabel(root);
+    }
+  }]);
+
+  return MDCFloatingLabel;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_component__["a" /* default */]);
+
+
+
+/***/ }),
+
+/***/ 20:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_foundation__ = __webpack_require__(0);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__adapter__ = __webpack_require__(13);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__constants__ = __webpack_require__(21);
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * @license
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+/**
+ * @extends {MDCFoundation<!MDCFloatingLabelAdapter>}
+ * @final
+ */
+
+var MDCFloatingLabelFoundation = function (_MDCFoundation) {
+  _inherits(MDCFloatingLabelFoundation, _MDCFoundation);
+
+  _createClass(MDCFloatingLabelFoundation, null, [{
+    key: 'cssClasses',
+
+    /** @return enum {string} */
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */];
+    }
+
+    /**
+     * {@see MDCFloatingLabelAdapter} for typing information on parameters and return
+     * types.
+     * @return {!MDCFloatingLabelAdapter}
+     */
+
+  }, {
+    key: 'defaultAdapter',
+    get: function get() {
+      return (/** @type {!MDCFloatingLabelAdapter} */{
+          addClass: function addClass() {},
+          removeClass: function removeClass() {},
+          getWidth: function getWidth() {},
+          registerInteractionHandler: function registerInteractionHandler() {},
+          deregisterInteractionHandler: function deregisterInteractionHandler() {}
+        }
+      );
+    }
+
+    /**
+     * @param {!MDCFloatingLabelAdapter} adapter
+     */
+
+  }]);
+
+  function MDCFloatingLabelFoundation(adapter) {
+    _classCallCheck(this, MDCFloatingLabelFoundation);
+
+    /** @private {function(!Event): undefined} */
+    var _this = _possibleConstructorReturn(this, (MDCFloatingLabelFoundation.__proto__ || Object.getPrototypeOf(MDCFloatingLabelFoundation)).call(this, _extends(MDCFloatingLabelFoundation.defaultAdapter, adapter)));
+
+    _this.shakeAnimationEndHandler_ = function () {
+      return _this.handleShakeAnimationEnd_();
+    };
+    return _this;
+  }
+
+  _createClass(MDCFloatingLabelFoundation, [{
+    key: 'init',
+    value: function init() {
+      this.adapter_.registerInteractionHandler('animationend', this.shakeAnimationEndHandler_);
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      this.adapter_.deregisterInteractionHandler('animationend', this.shakeAnimationEndHandler_);
+    }
+
+    /**
+     * Returns the width of the label element.
+     * @return {number}
+     */
+
+  }, {
+    key: 'getWidth',
+    value: function getWidth() {
+      return this.adapter_.getWidth();
+    }
+
+    /**
+     * Styles the label to produce the label shake for errors.
+     * @param {boolean} shouldShake adds shake class if true,
+     * otherwise removes shake class.
+     */
+
+  }, {
+    key: 'shake',
+    value: function shake(shouldShake) {
+      var LABEL_SHAKE = MDCFloatingLabelFoundation.cssClasses.LABEL_SHAKE;
+
+      if (shouldShake) {
+        this.adapter_.addClass(LABEL_SHAKE);
+      } else {
+        this.adapter_.removeClass(LABEL_SHAKE);
+      }
+    }
+
+    /**
+     * Styles the label to float or dock.
+     * @param {boolean} shouldFloat adds float class if true, otherwise remove
+     * float and shake class to dock label.
+     */
+
+  }, {
+    key: 'float',
+    value: function float(shouldFloat) {
+      var _MDCFloatingLabelFoun = MDCFloatingLabelFoundation.cssClasses,
+          LABEL_FLOAT_ABOVE = _MDCFloatingLabelFoun.LABEL_FLOAT_ABOVE,
+          LABEL_SHAKE = _MDCFloatingLabelFoun.LABEL_SHAKE;
+
+      if (shouldFloat) {
+        this.adapter_.addClass(LABEL_FLOAT_ABOVE);
+      } else {
+        this.adapter_.removeClass(LABEL_FLOAT_ABOVE);
+        this.adapter_.removeClass(LABEL_SHAKE);
+      }
+    }
+
+    /**
+     * Handles an interaction event on the root element.
+     */
+
+  }, {
+    key: 'handleShakeAnimationEnd_',
+    value: function handleShakeAnimationEnd_() {
+      var LABEL_SHAKE = MDCFloatingLabelFoundation.cssClasses.LABEL_SHAKE;
+
+      this.adapter_.removeClass(LABEL_SHAKE);
+    }
+  }]);
+
+  return MDCFloatingLabelFoundation;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_foundation__["a" /* default */]);
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCFloatingLabelFoundation);
+
+/***/ }),
+
+/***/ 21:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return cssClasses; });
+/**
+ * @license
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/** @enum {string} */
+var cssClasses = {
+  LABEL_FLOAT_ABOVE: 'mdc-floating-label--float-above',
+  LABEL_SHAKE: 'mdc-floating-label--shake'
+};
+
+
+
+/***/ })
+
+/******/ });
+});
+//# sourceMappingURL=mdc.floatingLabel.js.map
\ No newline at end of file
diff --git a/node_modules/@material/floating-label/dist/mdc.floatingLabel.min.js b/node_modules/@material/floating-label/dist/mdc.floatingLabel.min.js
new file mode 100644
index 0000000..14d5553
--- /dev/null
+++ b/node_modules/@material/floating-label/dist/mdc.floatingLabel.min.js
@@ -0,0 +1,23 @@
+/*!
+ Material Components for the Web
+ Copyright (c) 2018 Google Inc.
+ License: Apache-2.0
+*/
+!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.floatingLabel=t():(e.mdc=e.mdc||{},e.mdc.floatingLabel=t())}(this,function(){return function(e){function t(r){if(n[r])return n[r].exports;var o=n[r]={i:r,l:!1,exports:{}};return e[r].call(o.exports,o,o.exports,t),o.l=!0,o.exports}var n={};return t.m=e,t.c=n,t.d=function(e,n,r){t.o(e,n)||Object.defineProperty(e,n,{configurable:!1,enumerable:!0,get:r})},t.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(n,"a",n),n},t.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},t.p="",t(t.s=19)}({0:function(e,t,n){"use strict";function r(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}var o=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),i=function(){function e(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};r(this,e),this.adapter_=t}return o(e,null,[{key:"cssClasses",get:function(){return{}}},{key:"strings",get:function(){return{}}},{key:"numbers",get:function(){return{}}},{key:"defaultAdapter",get:function(){return{}}}]),o(e,[{key:"init",value:function(){}},{key:"destroy",value:function(){}}]),e}();t.a=i},1:function(e,t,n){"use strict";function r(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}var o=n(0),i=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),a=function(){function e(t){var n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:void 0;r(this,e),this.root_=t;for(var o=arguments.length,i=Array(o>2?o-2:0),a=2;a<o;a++)i[a-2]=arguments[a];this.initialize.apply(this,i),this.foundation_=void 0===n?this.getDefaultFoundation():n,this.foundation_.init(),this.initialSyncWithDOM()}return i(e,null,[{key:"attachTo",value:function(t){return new e(t,new o.a)}}]),i(e,[{key:"initialize",value:function(){}},{key:"getDefaultFoundation",value:function(){throw new Error("Subclasses must override getDefaultFoundation to return a properly configured foundation class")}},{key:"initialSyncWithDOM",value:function(){}},{key:"destroy",value:function(){this.foundation_.destroy()}},{key:"listen",value:function(e,t){this.root_.addEventListener(e,t)}},{key:"unlisten",value:function(e,t){this.root_.removeEventListener(e,t)}},{key:"emit",value:function(e,t){var n=arguments.length>2&&void 0!==arguments[2]&&arguments[2],r=void 0;"function"==typeof CustomEvent?r=new CustomEvent(e,{detail:t,bubbles:n}):(r=document.createEvent("CustomEvent"),r.initCustomEvent(e,n,!1,t)),this.root_.dispatchEvent(r)}}]),e}();t.a=a},13:function(e,t,n){"use strict";function r(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}var o=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}();!function(){function e(){r(this,e)}o(e,[{key:"addClass",value:function(e){}},{key:"removeClass",value:function(e){}},{key:"getWidth",value:function(){}},{key:"registerInteractionHandler",value:function(e,t){}},{key:"deregisterInteractionHandler",value:function(e,t){}}])}()},19:function(e,t,n){"use strict";function r(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function o(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function i(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0}),n.d(t,"MDCFloatingLabel",function(){return s});var a=n(1),u=(n(13),n(20));n.d(t,"MDCFloatingLabelFoundation",function(){return u.a});var c=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),s=function(e){function t(){return r(this,t),o(this,(t.__proto__||Object.getPrototypeOf(t)).apply(this,arguments))}return i(t,e),c(t,[{key:"shake",value:function(e){this.foundation_.shake(e)}},{key:"float",value:function(e){this.foundation_.float(e)}},{key:"getWidth",value:function(){return this.foundation_.getWidth()}},{key:"getDefaultFoundation",value:function(){var e=this;return new u.a({addClass:function(t){return e.root_.classList.add(t)},removeClass:function(t){return e.root_.classList.remove(t)},getWidth:function(){return e.root_.offsetWidth},registerInteractionHandler:function(t,n){return e.root_.addEventListener(t,n)},deregisterInteractionHandler:function(t,n){return e.root_.removeEventListener(t,n)}})}}],[{key:"attachTo",value:function(e){return new t(e)}}]),t}(a.a)},20:function(e,t,n){"use strict";function r(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function o(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function i(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}var a=n(0),u=(n(13),n(21)),c=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},s=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),f=function(e){function t(e){r(this,t);var n=o(this,(t.__proto__||Object.getPrototypeOf(t)).call(this,c(t.defaultAdapter,e)));return n.shakeAnimationEndHandler_=function(){return n.handleShakeAnimationEnd_()},n}return i(t,e),s(t,null,[{key:"cssClasses",get:function(){return u.a}},{key:"defaultAdapter",get:function(){return{addClass:function(){},removeClass:function(){},getWidth:function(){},registerInteractionHandler:function(){},deregisterInteractionHandler:function(){}}}}]),s(t,[{key:"init",value:function(){this.adapter_.registerInteractionHandler("animationend",this.shakeAnimationEndHandler_)}},{key:"destroy",value:function(){this.adapter_.deregisterInteractionHandler("animationend",this.shakeAnimationEndHandler_)}},{key:"getWidth",value:function(){return this.adapter_.getWidth()}},{key:"shake",value:function(e){var n=t.cssClasses.LABEL_SHAKE;e?this.adapter_.addClass(n):this.adapter_.removeClass(n)}},{key:"float",value:function(e){var n=t.cssClasses,r=n.LABEL_FLOAT_ABOVE,o=n.LABEL_SHAKE;e?this.adapter_.addClass(r):(this.adapter_.removeClass(r),this.adapter_.removeClass(o))}},{key:"handleShakeAnimationEnd_",value:function(){var e=t.cssClasses.LABEL_SHAKE;this.adapter_.removeClass(e)}}]),t}(a.a);t.a=f},21:function(e,t,n){"use strict";n.d(t,"a",function(){return r});/**
+ * @license
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+var r={LABEL_FLOAT_ABOVE:"mdc-floating-label--float-above",LABEL_SHAKE:"mdc-floating-label--shake"}}})});
+//# sourceMappingURL=mdc.floatingLabel.min.js.map
\ No newline at end of file
diff --git a/node_modules/@material/floating-label/foundation.js b/node_modules/@material/floating-label/foundation.js
new file mode 100644
index 0000000..330d4a1
--- /dev/null
+++ b/node_modules/@material/floating-label/foundation.js
@@ -0,0 +1,111 @@
+/**
+ * @license
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import MDCFoundation from '@material/base/foundation';
+import MDCFloatingLabelAdapter from './adapter';
+import {cssClasses} from './constants';
+
+/**
+ * @extends {MDCFoundation<!MDCFloatingLabelAdapter>}
+ * @final
+ */
+class MDCFloatingLabelFoundation extends MDCFoundation {
+  /** @return enum {string} */
+  static get cssClasses() {
+    return cssClasses;
+  }
+
+  /**
+   * {@see MDCFloatingLabelAdapter} for typing information on parameters and return
+   * types.
+   * @return {!MDCFloatingLabelAdapter}
+   */
+  static get defaultAdapter() {
+    return /** @type {!MDCFloatingLabelAdapter} */ ({
+      addClass: () => {},
+      removeClass: () => {},
+      getWidth: () => {},
+      registerInteractionHandler: () => {},
+      deregisterInteractionHandler: () => {},
+    });
+  }
+
+  /**
+   * @param {!MDCFloatingLabelAdapter} adapter
+   */
+  constructor(adapter) {
+    super(Object.assign(MDCFloatingLabelFoundation.defaultAdapter, adapter));
+
+    /** @private {function(!Event): undefined} */
+    this.shakeAnimationEndHandler_ = () => this.handleShakeAnimationEnd_();
+  }
+
+  init() {
+    this.adapter_.registerInteractionHandler('animationend', this.shakeAnimationEndHandler_);
+  }
+
+  destroy() {
+    this.adapter_.deregisterInteractionHandler('animationend', this.shakeAnimationEndHandler_);
+  }
+
+  /**
+   * Returns the width of the label element.
+   * @return {number}
+   */
+  getWidth() {
+    return this.adapter_.getWidth();
+  }
+
+  /**
+   * Styles the label to produce the label shake for errors.
+   * @param {boolean} shouldShake adds shake class if true,
+   * otherwise removes shake class.
+   */
+  shake(shouldShake) {
+    const {LABEL_SHAKE} = MDCFloatingLabelFoundation.cssClasses;
+    if (shouldShake) {
+      this.adapter_.addClass(LABEL_SHAKE);
+    } else {
+      this.adapter_.removeClass(LABEL_SHAKE);
+    }
+  }
+
+  /**
+   * Styles the label to float or dock.
+   * @param {boolean} shouldFloat adds float class if true, otherwise remove
+   * float and shake class to dock label.
+   */
+  float(shouldFloat) {
+    const {LABEL_FLOAT_ABOVE, LABEL_SHAKE} = MDCFloatingLabelFoundation.cssClasses;
+    if (shouldFloat) {
+      this.adapter_.addClass(LABEL_FLOAT_ABOVE);
+    } else {
+      this.adapter_.removeClass(LABEL_FLOAT_ABOVE);
+      this.adapter_.removeClass(LABEL_SHAKE);
+    }
+  }
+
+  /**
+   * Handles an interaction event on the root element.
+   */
+  handleShakeAnimationEnd_() {
+    const {LABEL_SHAKE} = MDCFloatingLabelFoundation.cssClasses;
+    this.adapter_.removeClass(LABEL_SHAKE);
+  }
+}
+
+export default MDCFloatingLabelFoundation;
diff --git a/node_modules/@material/floating-label/index.js b/node_modules/@material/floating-label/index.js
new file mode 100644
index 0000000..2d4fbad
--- /dev/null
+++ b/node_modules/@material/floating-label/index.js
@@ -0,0 +1,74 @@
+/**
+ * @license
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import MDCComponent from '@material/base/component';
+import MDCFloatingLabelAdapter from './adapter';
+import MDCFloatingLabelFoundation from './foundation';
+
+/**
+ * @extends {MDCComponent<!MDCFloatingLabelFoundation>}
+ * @final
+ */
+class MDCFloatingLabel extends MDCComponent {
+  /**
+   * @param {!Element} root
+   * @return {!MDCFloatingLabel}
+   */
+  static attachTo(root) {
+    return new MDCFloatingLabel(root);
+  }
+
+  /**
+   * Styles the label to produce the label shake for errors.
+   * @param {boolean} shouldShake styles the label to shake by adding shake class
+   * if true, otherwise will stop shaking by removing shake class.
+   */
+  shake(shouldShake) {
+    this.foundation_.shake(shouldShake);
+  }
+
+  /**
+   * Styles label to float/dock.
+   * @param {boolean} shouldFloat styles the label to float by adding float class
+   * if true, otherwise docks the label by removing the float class.
+   */
+  float(shouldFloat) {
+    this.foundation_.float(shouldFloat);
+  }
+
+  /**
+   * @return {number}
+   */
+  getWidth() {
+    return this.foundation_.getWidth();
+  }
+
+  /**
+   * @return {!MDCFloatingLabelFoundation}
+   */
+  getDefaultFoundation() {
+    return new MDCFloatingLabelFoundation({
+      addClass: (className) => this.root_.classList.add(className),
+      removeClass: (className) => this.root_.classList.remove(className),
+      getWidth: () => this.root_.offsetWidth,
+      registerInteractionHandler: (evtType, handler) => this.root_.addEventListener(evtType, handler),
+      deregisterInteractionHandler: (evtType, handler) => this.root_.removeEventListener(evtType, handler),
+    });
+  }
+}
+
+export {MDCFloatingLabel, MDCFloatingLabelFoundation};
diff --git a/node_modules/@material/floating-label/mdc-floating-label.scss b/node_modules/@material/floating-label/mdc-floating-label.scss
new file mode 100644
index 0000000..3f16d02
--- /dev/null
+++ b/node_modules/@material/floating-label/mdc-floating-label.scss
@@ -0,0 +1,70 @@
+//
+// Copyright 2017 Google Inc. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+@import "@material/animation/variables";
+@import "@material/base/mixins";
+@import "@material/rtl/mixins";
+@import "@material/theme/variables";
+@import "@material/theme/mixins";
+@import "@material/typography/mixins";
+@import "./mixins";
+@import "./variables";
+
+// Floating Label is intended for use by multiple components, but its styles should only be emitted once when bundled
+@include mdc-base-emit-once("mdc-floating-label") {
+  // postcss-bem-linter: define floating-label
+  .mdc-floating-label {
+    @include mdc-typography(subtitle1);
+
+    position: absolute;
+    bottom: 8px;
+    left: 0;
+    transform-origin: left top;
+    transition:
+      transform $mdc-floating-label-transition-duration $mdc-animation-standard-curve-timing-function,
+      color $mdc-floating-label-transition-duration $mdc-animation-standard-curve-timing-function;
+    line-height: 1.15rem;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    cursor: text;
+    overflow: hidden;
+    // Force the label into its own layer to prevent visible layer promotion adjustments
+    // when the ripple is activated behind it.
+    will-change: transform;
+
+    @include mdc-rtl {
+      /* @noflip */
+      right: 0;
+
+      /* @noflip */
+      left: auto;
+
+      /* @noflip */
+      transform-origin: right top;
+    }
+  }
+
+  .mdc-floating-label--float-above {
+    cursor: auto;
+  }
+
+  @at-root {
+    @include mdc-floating-label-float-position($mdc-floating-label-position-y);
+    @include mdc-floating-label-shake-animation(standard);
+  }
+
+  @include mdc-floating-label-shake-keyframes(standard, $mdc-floating-label-position-y);
+}
diff --git a/node_modules/@material/floating-label/node_modules/@material/theme/README.md b/node_modules/@material/floating-label/node_modules/@material/theme/README.md
new file mode 100644
index 0000000..f757529
--- /dev/null
+++ b/node_modules/@material/floating-label/node_modules/@material/theme/README.md
@@ -0,0 +1,181 @@
+<!--docs:
+title: "Theme"
+layout: detail
+section: components
+excerpt: "Color theming for MDC Web components."
+iconId: theme
+path: /catalog/theme/
+-->
+
+# Theme
+
+The Material Design color system can be used to create a color scheme that reflects your brand or style.
+
+## Design & API Documentation
+
+<ul class="icon-list">
+  <li class="icon-list-item icon-list-item--spec">
+    <a href="https://material.io/go/design-theming">Material Design guidelines: Color</a>
+  </li>
+</ul>
+
+## Installation
+
+```
+npm install @material/theme
+```
+
+## Usage
+
+### Color Scheme
+
+You can define the theme color variables before importing any MDC Web components:
+
+```scss
+$mdc-theme-primary: #fcb8ab;
+$mdc-theme-secondary: #feeae6;
+$mdc-theme-on-primary: #442b2d;
+$mdc-theme-on-secondary: #442b2d;
+
+@import "@material/button/mdc-button";
+```
+
+We suggest you follow the Web Content Accessibility Guidelines 2.0 when picking the values for on-primary, on-secondary, etc. These values should be accessible on top of the corresponding value, e.g. primary and secondary.
+
+https://www.w3.org/TR/WCAG20
+
+### Advanced customization
+
+Color scheme will only get you 80% of the way to a well-designed app. Inevitably there will be some components that do not work "out of the box". To fix problems with accessibility and design, we suggest you use our Sass mixins, such as `mdc-button-filled-accessible`. For more information, consult the documentation for each component.
+
+### Non-Sass customization
+
+Only a very limited number of Material Design color customization features are supported for non-Sass clients. They are a set of CSS custom properties, and a set of CSS classes.
+
+#### CSS Custom Properties
+
+**A note about `<TEXT_STYLE>`**, `<TEXT_STYLE>` represents the lowercase name of the text styles listed above, e.g. `hint`.
+
+CSS Custom property | Description
+--- | ---
+`--mdc-theme-primary` | The theme primary color
+`--mdc-theme-secondary` | The theme secondary color
+`--mdc-theme-background` | The theme background color
+`--mdc-theme-surface` | The theme surface color
+`--mdc-theme-on-primary` | Text color on top of a primary background
+`--mdc-theme-on-secondary` | Text color on top of a secondary background
+`--mdc-theme-on-surface` | Text color on top of a surface background
+`--mdc-theme-text-<TEXT_STYLE>-on-light` | Text color for TEXT_STYLE on top of light background
+`--mdc-theme-text-<TEXT_STYLE>-on-dark` | Text color for TEXT_STYLE on top of dark background
+
+#### CSS Classes
+
+> **A note about `<TEXT_STYLE>`**, `<TEXT_STYLE>` represents the lowercase name of the text styles listed above, e.g. `hint`.
+
+CSS Class | Description
+--- | ---
+`mdc-theme--primary` | Sets the text color to the theme primary color
+`mdc-theme--secondary` | Sets the text color to the theme secondary color
+`mdc-theme--background` | Sets the background color to the theme background color
+`mdc-theme--surface` | Sets the surface color to the theme surface color
+`mdc-theme--on-primary` | Sets the text color to the theme on-primary color
+`mdc-theme--on-secondary` | Sets the text color to the theme on-secondary color
+`mdc-theme--on-surface` | Sets the text color to the theme on-surface color
+`mdc-theme--primary-bg` | Sets the background color to the theme primary color
+`mdc-theme--secondary-bg` | Sets the background color to the theme secondary color
+`mdc-theme--text-<TEXT_STYLE>-on-light` | Sets text to a suitable color for TEXT_STYLE on top of light background
+`mdc-theme--text-<TEXT_STYLE>-on-dark` | Sets text to a suitable color for TEXT_STYLE on top of dark background
+
+### Sass Mixins, Variables, and Functions
+
+Mixin | Description
+--- | ---
+`mdc-theme-prop($property, $style, $important, $edgeOptOut)` | Applies a theme color or a custom color to a CSS property, optionally with `!important`. If `$edgeOptOut` is `true` and a theme color is passed, the style will be wrapped in a `@supports` clause to exclude the style in Edge to avoid issues with its buggy CSS variable support.
+
+#### `mdc-theme-prop` Properties
+
+The properties below can be used as the `$style` argument for the `mdc-theme-prop` mixin. Literal color values (e.g., `rgba(0, 0, 0, .75)`) may also be used instead.
+
+**A note about `<TEXT_STYLE>`**, `<TEXT_STYLE>` represents the lowercase name of the text styles listed above, e.g. `hint`.
+
+Property Name | Description
+--- | ---
+`primary` | The theme primary color
+`secondary` | The theme secondary color
+`background` | The theme background color
+`surface` | The theme surface color
+`text-<TEXT_STYLE>-on-light` | TEXT_STYLE on top of a light background
+`text-<TEXT_STYLE>-on-dark` | TEXT_STYLE on top of a dark background
+`on-primary` | A text/iconography color that is usable on top of primary color
+`on-secondary` | A text/iconography color that is usable on top of secondary color
+`on-surface` | A text/iconography color that is usable on top of surface color
+
+
+#### `mdc-theme-luminance($color)`
+
+Calculates the luminance value (0 - 1) of a given color.
+
+```scss
+@debug mdc-theme-luminance(#9c27b0); // 0.11654
+```
+
+#### `mdc-theme-contrast($back, $front)`
+
+Calculates the contrast ratio between two colors.
+
+```scss
+@debug mdc-theme-contrast(#9c27b0, #000); // 3.33071
+```
+
+#### `mdc-theme-tone($color)`
+
+Determines whether the given color is "light" or "dark".
+
+If the input color is a string literal equal to `"light"` or `"dark"`, it will be returned verbatim.
+
+```scss
+@debug mdc-theme-tone(#9c27b0); // dark
+@debug mdc-theme-tone(light);   // light
+```
+
+#### `mdc-theme-contrast-tone($color)`
+
+Determines whether to use light or dark text on top of a given color.
+
+```scss
+@debug mdc-theme-contrast-tone(#9c27b0); // light
+```
+
+#### `mdc-theme-prop-value($style)`
+
+If `$style` is a color (a literal color value, `currentColor`, or a CSS custom property), it is returned verbatim.
+Otherwise, `$style` is treated as a theme property name, and the corresponding value from `$mdc-theme-property-values`
+is returned. If this also fails, an error is thrown.
+
+This is mainly useful in situations where `mdc-theme-prop` cannot be used directly (e.g., `box-shadow`).
+
+Unlike the `mdc-theme-prop` mixin, this function does _not_ support CSS custom properties.
+It only returns the raw color value of the specified theme property.
+
+> NOTE: This function is defined in `_variables.scss` instead of `_functions.scss` to avoid circular imports.
+
+```scss
+@debug mdc-theme-prop-value(primary); // #3f51b5
+@debug mdc-theme-prop-value(blue);    // blue
+```
+
+#### `mdc-theme-accessible-ink-color($fill-color, $text-style: primary)`
+
+Returns an accessible ink color that has sufficient contrast against the given fill color.
+
+Params:
+
+- `$fill-color`: Supports the same values as `mdc-theme-prop-value`
+- `$text-style`: Value must be one of `primary`, `secondary`, `hint`, `disabled`, `icon` (see `$mdc-theme-text-colors`)
+
+> NOTE: This function is defined in `_variables.scss` instead of `_functions.scss` to avoid circular imports.
+
+```scss
+@debug mdc-theme-accessible-ink-color(secondary); // rgba(0, 0, 0, .87) (text-primary-on-light)
+@debug mdc-theme-accessible-ink-color(blue);      // white              (text-primary-on-dark)
+```
diff --git a/node_modules/@material/floating-label/node_modules/@material/theme/_color-palette.scss b/node_modules/@material/floating-label/node_modules/@material/theme/_color-palette.scss
new file mode 100644
index 0000000..ef5122b
--- /dev/null
+++ b/node_modules/@material/floating-label/node_modules/@material/theme/_color-palette.scss
@@ -0,0 +1,290 @@
+//
+// Copyright 2017 Google Inc. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+// stylelint-disable scss/dollar-variable-pattern, color-hex-length
+
+$material-color-red-50: #ffebee;
+$material-color-red-100: #ffcdd2;
+$material-color-red-200: #ef9a9a;
+$material-color-red-300: #e57373;
+$material-color-red-400: #ef5350;
+$material-color-red-500: #f44336;
+$material-color-red-600: #e53935;
+$material-color-red-700: #d32f2f;
+$material-color-red-800: #c62828;
+$material-color-red-900: #b71c1c;
+$material-color-red-a100: #ff8a80;
+$material-color-red-a200: #ff5252;
+$material-color-red-a400: #ff1744;
+$material-color-red-a700: #d50000;
+
+$material-color-pink-50: #fce4ec;
+$material-color-pink-100: #f8bbd0;
+$material-color-pink-200: #f48fb1;
+$material-color-pink-300: #f06292;
+$material-color-pink-400: #ec407a;
+$material-color-pink-500: #e91e63;
+$material-color-pink-600: #d81b60;
+$material-color-pink-700: #c2185b;
+$material-color-pink-800: #ad1457;
+$material-color-pink-900: #880e4f;
+$material-color-pink-a100: #ff80ab;
+$material-color-pink-a200: #ff4081;
+$material-color-pink-a400: #f50057;
+$material-color-pink-a700: #c51162;
+
+$material-color-purple-50: #f3e5f5;
+$material-color-purple-100: #e1bee7;
+$material-color-purple-200: #ce93d8;
+$material-color-purple-300: #ba68c8;
+$material-color-purple-400: #ab47bc;
+$material-color-purple-500: #9c27b0;
+$material-color-purple-600: #8e24aa;
+$material-color-purple-700: #7b1fa2;
+$material-color-purple-800: #6a1b9a;
+$material-color-purple-900: #4a148c;
+$material-color-purple-a100: #ea80fc;
+$material-color-purple-a200: #e040fb;
+$material-color-purple-a400: #d500f9;
+$material-color-purple-a700: #aa00ff;
+
+$material-color-deep-purple-50: #ede7f6;
+$material-color-deep-purple-100: #d1c4e9;
+$material-color-deep-purple-200: #b39ddb;
+$material-color-deep-purple-300: #9575cd;
+$material-color-deep-purple-400: #7e57c2;
+$material-color-deep-purple-500: #673ab7;
+$material-color-deep-purple-600: #5e35b1;
+$material-color-deep-purple-700: #512da8;
+$material-color-deep-purple-800: #4527a0;
+$material-color-deep-purple-900: #311b92;
+$material-color-deep-purple-a100: #b388ff;
+$material-color-deep-purple-a200: #7c4dff;
+$material-color-deep-purple-a400: #651fff;
+$material-color-deep-purple-a700: #6200ea;
+
+$material-color-indigo-50: #e8eaf6;
+$material-color-indigo-100: #c5cae9;
+$material-color-indigo-200: #9fa8da;
+$material-color-indigo-300: #7986cb;
+$material-color-indigo-400: #5c6bc0;
+$material-color-indigo-500: #3f51b5;
+$material-color-indigo-600: #3949ab;
+$material-color-indigo-700: #303f9f;
+$material-color-indigo-800: #283593;
+$material-color-indigo-900: #1a237e;
+$material-color-indigo-a100: #8c9eff;
+$material-color-indigo-a200: #536dfe;
+$material-color-indigo-a400: #3d5afe;
+$material-color-indigo-a700: #304ffe;
+
+$material-color-blue-50: #e3f2fd;
+$material-color-blue-100: #bbdefb;
+$material-color-blue-200: #90caf9;
+$material-color-blue-300: #64b5f6;
+$material-color-blue-400: #42a5f5;
+$material-color-blue-500: #2196f3;
+$material-color-blue-600: #1e88e5;
+$material-color-blue-700: #1976d2;
+$material-color-blue-800: #1565c0;
+$material-color-blue-900: #0d47a1;
+$material-color-blue-a100: #82b1ff;
+$material-color-blue-a200: #448aff;
+$material-color-blue-a400: #2979ff;
+$material-color-blue-a700: #2962ff;
+
+$material-color-light-blue-50: #e1f5fe;
+$material-color-light-blue-100: #b3e5fc;
+$material-color-light-blue-200: #81d4fa;
+$material-color-light-blue-300: #4fc3f7;
+$material-color-light-blue-400: #29b6f6;
+$material-color-light-blue-500: #03a9f4;
+$material-color-light-blue-600: #039be5;
+$material-color-light-blue-700: #0288d1;
+$material-color-light-blue-800: #0277bd;
+$material-color-light-blue-900: #01579b;
+$material-color-light-blue-a100: #80d8ff;
+$material-color-light-blue-a200: #40c4ff;
+$material-color-light-blue-a400: #00b0ff;
+$material-color-light-blue-a700: #0091ea;
+
+$material-color-cyan-50: #e0f7fa;
+$material-color-cyan-100: #b2ebf2;
+$material-color-cyan-200: #80deea;
+$material-color-cyan-300: #4dd0e1;
+$material-color-cyan-400: #26c6da;
+$material-color-cyan-500: #00bcd4;
+$material-color-cyan-600: #00acc1;
+$material-color-cyan-700: #0097a7;
+$material-color-cyan-800: #00838f;
+$material-color-cyan-900: #006064;
+$material-color-cyan-a100: #84ffff;
+$material-color-cyan-a200: #18ffff;
+$material-color-cyan-a400: #00e5ff;
+$material-color-cyan-a700: #00b8d4;
+
+$material-color-teal-50: #e0f2f1;
+$material-color-teal-100: #b2dfdb;
+$material-color-teal-200: #80cbc4;
+$material-color-teal-300: #4db6ac;
+$material-color-teal-400: #26a69a;
+$material-color-teal-500: #009688;
+$material-color-teal-600: #00897b;
+$material-color-teal-700: #00796b;
+$material-color-teal-800: #00695c;
+$material-color-teal-900: #004d40;
+$material-color-teal-a100: #a7ffeb;
+$material-color-teal-a200: #64ffda;
+$material-color-teal-a400: #1de9b6;
+$material-color-teal-a700: #00bfa5;
+
+$material-color-green-50: #e8f5e9;
+$material-color-green-100: #c8e6c9;
+$material-color-green-200: #a5d6a7;
+$material-color-green-300: #81c784;
+$material-color-green-400: #66bb6a;
+$material-color-green-500: #4caf50;
+$material-color-green-600: #43a047;
+$material-color-green-700: #388e3c;
+$material-color-green-800: #2e7d32;
+$material-color-green-900: #1b5e20;
+$material-color-green-a100: #b9f6ca;
+$material-color-green-a200: #69f0ae;
+$material-color-green-a400: #00e676;
+$material-color-green-a700: #00c853;
+
+$material-color-light-green-50: #f1f8e9;
+$material-color-light-green-100: #dcedc8;
+$material-color-light-green-200: #c5e1a5;
+$material-color-light-green-300: #aed581;
+$material-color-light-green-400: #9ccc65;
+$material-color-light-green-500: #8bc34a;
+$material-color-light-green-600: #7cb342;
+$material-color-light-green-700: #689f38;
+$material-color-light-green-800: #558b2f;
+$material-color-light-green-900: #33691e;
+$material-color-light-green-a100: #ccff90;
+$material-color-light-green-a200: #b2ff59;
+$material-color-light-green-a400: #76ff03;
+$material-color-light-green-a700: #64dd17;
+
+$material-color-lime-50: #f9fbe7;
+$material-color-lime-100: #f0f4c3;
+$material-color-lime-200: #e6ee9c;
+$material-color-lime-300: #dce775;
+$material-color-lime-400: #d4e157;
+$material-color-lime-500: #cddc39;
+$material-color-lime-600: #c0ca33;
+$material-color-lime-700: #afb42b;
+$material-color-lime-800: #9e9d24;
+$material-color-lime-900: #827717;
+$material-color-lime-a100: #f4ff81;
+$material-color-lime-a200: #eeff41;
+$material-color-lime-a400: #c6ff00;
+$material-color-lime-a700: #aeea00;
+
+$material-color-yellow-50: #fffde7;
+$material-color-yellow-100: #fff9c4;
+$material-color-yellow-200: #fff59d;
+$material-color-yellow-300: #fff176;
+$material-color-yellow-400: #ffee58;
+$material-color-yellow-500: #ffeb3b;
+$material-color-yellow-600: #fdd835;
+$material-color-yellow-700: #fbc02d;
+$material-color-yellow-800: #f9a825;
+$material-color-yellow-900: #f57f17;
+$material-color-yellow-a100: #ffff8d;
+$material-color-yellow-a200: #ffff00;
+$material-color-yellow-a400: #ffea00;
+$material-color-yellow-a700: #ffd600;
+
+$material-color-amber-50: #fff8e1;
+$material-color-amber-100: #ffecb3;
+$material-color-amber-200: #ffe082;
+$material-color-amber-300: #ffd54f;
+$material-color-amber-400: #ffca28;
+$material-color-amber-500: #ffc107;
+$material-color-amber-600: #ffb300;
+$material-color-amber-700: #ffa000;
+$material-color-amber-800: #ff8f00;
+$material-color-amber-900: #ff6f00;
+$material-color-amber-a100: #ffe57f;
+$material-color-amber-a200: #ffd740;
+$material-color-amber-a400: #ffc400;
+$material-color-amber-a700: #ffab00;
+
+$material-color-orange-50: #fff3e0;
+$material-color-orange-100: #ffe0b2;
+$material-color-orange-200: #ffcc80;
+$material-color-orange-300: #ffb74d;
+$material-color-orange-400: #ffa726;
+$material-color-orange-500: #ff9800;
+$material-color-orange-600: #fb8c00;
+$material-color-orange-700: #f57c00;
+$material-color-orange-800: #ef6c00;
+$material-color-orange-900: #e65100;
+$material-color-orange-a100: #ffd180;
+$material-color-orange-a200: #ffab40;
+$material-color-orange-a400: #ff9100;
+$material-color-orange-a700: #ff6d00;
+
+$material-color-deep-orange-50: #fbe9e7;
+$material-color-deep-orange-100: #ffccbc;
+$material-color-deep-orange-200: #ffab91;
+$material-color-deep-orange-300: #ff8a65;
+$material-color-deep-orange-400: #ff7043;
+$material-color-deep-orange-500: #ff5722;
+$material-color-deep-orange-600: #f4511e;
+$material-color-deep-orange-700: #e64a19;
+$material-color-deep-orange-800: #d84315;
+$material-color-deep-orange-900: #bf360c;
+$material-color-deep-orange-a100: #ff9e80;
+$material-color-deep-orange-a200: #ff6e40;
+$material-color-deep-orange-a400: #ff3d00;
+$material-color-deep-orange-a700: #dd2c00;
+
+$material-color-brown-50: #efebe9;
+$material-color-brown-100: #d7ccc8;
+$material-color-brown-200: #bcaaa4;
+$material-color-brown-300: #a1887f;
+$material-color-brown-400: #8d6e63;
+$material-color-brown-500: #795548;
+$material-color-brown-600: #6d4c41;
+$material-color-brown-700: #5d4037;
+$material-color-brown-800: #4e342e;
+$material-color-brown-900: #3e2723;
+
+$material-color-grey-50: #fafafa;
+$material-color-grey-100: #f5f5f5;
+$material-color-grey-200: #eeeeee;
+$material-color-grey-300: #e0e0e0;
+$material-color-grey-400: #bdbdbd;
+$material-color-grey-500: #9e9e9e;
+$material-color-grey-600: #757575;
+$material-color-grey-700: #616161;
+$material-color-grey-800: #424242;
+$material-color-grey-900: #212121;
+
+$material-color-blue-grey-50: #eceff1;
+$material-color-blue-grey-100: #cfd8dc;
+$material-color-blue-grey-200: #b0bec5;
+$material-color-blue-grey-300: #90a4ae;
+$material-color-blue-grey-400: #78909c;
+$material-color-blue-grey-500: #607d8b;
+$material-color-blue-grey-600: #546e7a;
+$material-color-blue-grey-700: #455a64;
+$material-color-blue-grey-800: #37474f;
+$material-color-blue-grey-900: #263238;
diff --git a/node_modules/@material/floating-label/node_modules/@material/theme/_constants.scss b/node_modules/@material/floating-label/node_modules/@material/theme/_constants.scss
new file mode 100644
index 0000000..baa150d
--- /dev/null
+++ b/node_modules/@material/floating-label/node_modules/@material/theme/_constants.scss
@@ -0,0 +1,283 @@
+//
+// Copyright 2017 Google Inc. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+// Precomputed linear color channel values, for use in contrast calculations.
+// See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+//
+// Algorithm, for c in 0 to 255:
+// f(c) {
+//   c = c / 255;
+//   return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+// }
+//
+// This lookup table is needed since there is no `pow` in SASS.
+$mdc-theme-linear-channel-values:
+  0
+  .0003035269835488375
+  .000607053967097675
+  .0009105809506465125
+  .00121410793419535
+  .0015176349177441874
+  .001821161901293025
+  .0021246888848418626
+  .0024282158683907
+  .0027317428519395373
+  .003035269835488375
+  .003346535763899161
+  .003676507324047436
+  .004024717018496307
+  .004391442037410293
+  .004776953480693729
+  .005181516702338386
+  .005605391624202723
+  .006048833022857054
+  .006512090792594475
+  .006995410187265387
+  .007499032043226175
+  .008023192985384994
+  .008568125618069307
+  .009134058702220787
+  .00972121732023785
+  .010329823029626936
+  .010960094006488246
+  .011612245179743885
+  .012286488356915872
+  .012983032342173012
+  .013702083047289686
+  .014443843596092545
+  .01520851442291271
+  .01599629336550963
+  .016807375752887384
+  .017641954488384078
+  .018500220128379697
+  .019382360956935723
+  .0202885630566524
+  .021219010376003555
+  .022173884793387385
+  .02315336617811041
+  .024157632448504756
+  .02518685962736163
+  .026241221894849898
+  .027320891639074894
+  .028426039504420793
+  .0295568344378088
+  .030713443732993635
+  .03189603307301153
+  .033104766570885055
+  .03433980680868217
+  .03560131487502034
+  .03688945040110004
+  .0382043715953465
+  .03954623527673284
+  .04091519690685319
+  .042311410620809675
+  .043735029256973465
+  .04518620438567554
+  .046665086336880095
+  .04817182422688942
+  .04970656598412723
+  .05126945837404324
+  .052860647023180246
+  .05448027644244237
+  .05612849004960009
+  .05780543019106723
+  .0595112381629812
+  .06124605423161761
+  .06301001765316767
+  .06480326669290577
+  .06662593864377289
+  .06847816984440017
+  .07036009569659588
+  .07227185068231748
+  .07421356838014963
+  .07618538148130785
+  .07818742180518633
+  .08021982031446832
+  .0822827071298148
+  .08437621154414882
+  .08650046203654976
+  .08865558628577294
+  .09084171118340768
+  .09305896284668745
+  .0953074666309647
+  .09758734714186246
+  .09989872824711389
+  .10224173308810132
+  .10461648409110419
+  .10702310297826761
+  .10946171077829933
+  .1119324278369056
+  .11443537382697373
+  .11697066775851084
+  .11953842798834562
+  .12213877222960187
+  .12477181756095049
+  .12743768043564743
+  .1301364766903643
+  .13286832155381798
+  .13563332965520566
+  .13843161503245183
+  .14126329114027164
+  .14412847085805777
+  .14702726649759498
+  .14995978981060856
+  .15292615199615017
+  .1559264637078274
+  .1589608350608804
+  .162029375639111
+  .1651321945016676
+  .16826940018969075
+  .1714411007328226
+  .17464740365558504
+  .17788841598362912
+  .18116424424986022
+  .184474994500441
+  .18782077230067787
+  .19120168274079138
+  .1946178304415758
+  .19806931955994886
+  .20155625379439707
+  .20507873639031693
+  .20863687014525575
+  .21223075741405523
+  .21586050011389926
+  .2195261997292692
+  .2232279573168085
+  .22696587351009836
+  .23074004852434915
+  .23455058216100522
+  .238397573812271
+  .24228112246555486
+  .24620132670783548
+  .25015828472995344
+  .25415209433082675
+  .2581828529215958
+  .26225065752969623
+  .26635560480286247
+  .2704977910130658
+  .27467731206038465
+  .2788942634768104
+  .2831487404299921
+  .2874408377269175
+  .29177064981753587
+  .2961382707983211
+  .3005437944157765
+  .3049873140698863
+  .30946892281750854
+  .31398871337571754
+  .31854677812509186
+  .32314320911295075
+  .3277780980565422
+  .33245153634617935
+  .33716361504833037
+  .3419144249086609
+  .3467040563550296
+  .35153259950043936
+  .3564001441459435
+  .3613067797835095
+  .3662525955988395
+  .3712376804741491
+  .3762621229909065
+  .38132601143253014
+  .386429433787049
+  .39157247774972326
+  .39675523072562685
+  .4019777798321958
+  .4072402119017367
+  .41254261348390375
+  .4178850708481375
+  .4232676699860717
+  .4286904966139066
+  .43415363617474895
+  .4396571738409188
+  .44520119451622786
+  .45078578283822346
+  .45641102318040466
+  .4620769996544071
+  .467783796112159
+  .47353149614800955
+  .4793201831008268
+  .4851499400560704
+  .4910208498478356
+  .4969329950608704
+  .5028864580325687
+  .5088813208549338
+  .5149176653765214
+  .5209955732043543
+  .5271151257058131
+  .5332764040105052
+  .5394794890121072
+  .5457244613701866
+  .5520114015120001
+  .5583403896342679
+  .5647115057049292
+  .5711248294648731
+  .5775804404296506
+  .5840784178911641
+  .5906188409193369
+  .5972017883637634
+  .6038273388553378
+  .6104955708078648
+  .6172065624196511
+  .6239603916750761
+  .6307571363461468
+  .6375968739940326
+  .6444796819705821
+  .6514056374198242
+  .6583748172794485
+  .665387298282272
+  .6724431569576875
+  .6795424696330938
+  .6866853124353135
+  .6938717612919899
+  .7011018919329731
+  .7083757798916868
+  .7156935005064807
+  .7230551289219693
+  .7304607400903537
+  .7379104087727308
+  .7454042095403874
+  .7529422167760779
+  .7605245046752924
+  .768151147247507
+  .7758222183174236
+  .7835377915261935
+  .7912979403326302
+  .799102738014409
+  .8069522576692516
+  .8148465722161012
+  .8227857543962835
+  .8307698767746546
+  .83879901174074
+  .846873231509858
+  .8549926081242338
+  .8631572134541023
+  .8713671191987972
+  .8796223968878317
+  .8879231178819663
+  .8962693533742664
+  .9046611743911496
+  .9130986517934192
+  .9215818562772946
+  .9301108583754237
+  .938685728457888
+  .9473065367331999
+  .9559733532492861
+  .9646862478944651
+  .9734452903984125
+  .9822505503331171
+  .9911020971138298
+  1;
diff --git a/node_modules/@material/floating-label/node_modules/@material/theme/_functions.scss b/node_modules/@material/floating-label/node_modules/@material/theme/_functions.scss
new file mode 100644
index 0000000..acf2ff7
--- /dev/null
+++ b/node_modules/@material/floating-label/node_modules/@material/theme/_functions.scss
@@ -0,0 +1,60 @@
+//
+// Copyright 2017 Google Inc. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+@import "./constants";
+
+// Calculate the luminance for a color.
+// See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+@function mdc-theme-luminance($color) {
+  $red: nth($mdc-theme-linear-channel-values, red($color) + 1);
+  $green: nth($mdc-theme-linear-channel-values, green($color) + 1);
+  $blue: nth($mdc-theme-linear-channel-values, blue($color) + 1);
+
+  @return .2126 * $red + .7152 * $green + .0722 * $blue;
+}
+
+// Calculate the contrast ratio between two colors.
+// See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+@function mdc-theme-contrast($back, $front) {
+  $backLum: mdc-theme-luminance($back) + .05;
+  $foreLum: mdc-theme-luminance($front) + .05;
+
+  @return max($backLum, $foreLum) / min($backLum, $foreLum);
+}
+
+// Determine whether the color is "light" or "dark".
+@function mdc-theme-tone($color) {
+  @if $color == "dark" or $color == "light" {
+    @return $color;
+  }
+
+  $minimumContrast: 3.1;
+
+  $lightContrast: mdc-theme-contrast($color, white);
+  $darkContrast: mdc-theme-contrast($color, rgba(black, .87));
+
+  @if ($lightContrast < $minimumContrast) and ($darkContrast > $lightContrast) {
+    @return "light";
+  } @else {
+    @return "dark";
+  }
+}
+
+// Determine whether to use dark or light text on top of given color to meet accessibility standards for contrast.
+// Returns "dark" if the given color is light and "light" if the given color is dark.
+@function mdc-theme-contrast-tone($color) {
+  @return if(mdc-theme-tone($color) == "dark", "light", "dark");
+}
diff --git a/node_modules/@material/floating-label/node_modules/@material/theme/_mixins.scss b/node_modules/@material/floating-label/node_modules/@material/theme/_mixins.scss
new file mode 100644
index 0000000..9510df2
--- /dev/null
+++ b/node_modules/@material/floating-label/node_modules/@material/theme/_mixins.scss
@@ -0,0 +1,80 @@
+//
+// Copyright 2017 Google Inc. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+@import "./variables";
+
+// Applies the correct theme color style to the specified property.
+// $property is typically color or background-color, but can be any CSS property that accepts color values.
+// $style should be one of the map keys in $mdc-theme-property-values (_variables.scss), or a color value.
+// $edgeOptOut controls whether to feature-detect around Edge to avoid emitting CSS variables for it,
+// intended for use in cases where interactions with pseudo-element styles cause problems due to Edge bugs.
+@mixin mdc-theme-prop($property, $style, $important: false, $edgeOptOut: false) {
+  @if mdc-theme-is-valid-theme-prop-value_($style) {
+    @if $important {
+      #{$property}: $style !important;
+    } @else {
+      #{$property}: $style;
+    }
+  } @else {
+    @if not map-has-key($mdc-theme-property-values, $style) {
+      @error "Invalid style: '#{$style}'. Choose one of: #{map-keys($mdc-theme-property-values)}";
+    }
+
+    $value: map-get($mdc-theme-property-values, $style);
+
+    @if $important {
+      #{$property}: $value !important;
+
+      @if $edgeOptOut {
+        // stylelint-disable max-nesting-depth
+        @at-root {
+          @supports not (-ms-ime-align:auto) {
+            // stylelint-disable scss/selector-no-redundant-nesting-selector
+            & {
+              /* @alternate */
+              #{$property}: var(--mdc-theme-#{$style}, $value) !important;
+            }
+            // stylelint-enable scss/selector-no-redundant-nesting-selector
+          }
+        }
+        // stylelint-enable max-nesting-depth
+      } @else {
+        /* @alternate */
+        #{$property}: var(--mdc-theme-#{$style}, $value) !important;
+      }
+    } @else {
+      #{$property}: $value;
+
+      @if $edgeOptOut {
+        // stylelint-disable max-nesting-depth
+        @at-root {
+          @supports not (-ms-ime-align:auto) {
+            // stylelint-disable scss/selector-no-redundant-nesting-selector
+            & {
+              /* @alternate */
+              #{$property}: var(--mdc-theme-#{$style}, $value);
+            }
+            // stylelint-enable scss/selector-no-redundant-nesting-selector
+          }
+        }
+        // stylelint-enable max-nesting-depth
+      } @else {
+        /* @alternate */
+        #{$property}: var(--mdc-theme-#{$style}, $value);
+      }
+    }
+  }
+}
diff --git a/node_modules/@material/floating-label/node_modules/@material/theme/_variables.scss b/node_modules/@material/floating-label/node_modules/@material/theme/_variables.scss
new file mode 100644
index 0000000..8c962f3
--- /dev/null
+++ b/node_modules/@material/floating-label/node_modules/@material/theme/_variables.scss
@@ -0,0 +1,140 @@
+//
+// Copyright 2017 Google Inc. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+@import "./functions";
+
+//
+// Main theme colors for your brand.
+//
+// If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+//
+
+$mdc-theme-primary: #6200ee !default; // baseline purple, 500 tone
+$mdc-theme-on-primary: if(mdc-theme-contrast-tone($mdc-theme-primary) == "dark", #000, #fff) !default;
+
+// The $mdc-theme-accent variable is DEPRECATED - it exists purely for backward compatibility.
+// The $mdc-theme-secondary* variables should be used for all new projects.
+$mdc-theme-accent: #018786 !default; // baseline teal, 600 tone
+$mdc-theme-secondary: $mdc-theme-accent !default;
+$mdc-theme-on-secondary: if(mdc-theme-contrast-tone($mdc-theme-secondary) == "dark", #000, #fff) !default;
+$mdc-theme-background: #fff !default; // White
+
+$mdc-theme-surface: #fff !default;
+$mdc-theme-on-surface: if(mdc-theme-contrast-tone($mdc-theme-surface) == "dark", #000, #fff) !default;
+
+//
+// Text colors according to light vs dark and text type.
+//
+
+$mdc-theme-text-colors: (
+  dark: (
+    primary: rgba(black, .87),
+    secondary: rgba(black, .54),
+    hint: rgba(black, .38),
+    disabled: rgba(black, .38),
+    icon: rgba(black, .38)
+  ),
+  light: (
+    primary: white,
+    secondary: rgba(white, .7),
+    hint: rgba(white, .5),
+    disabled: rgba(white, .5),
+    icon: rgba(white, .5)
+  )
+) !default;
+
+@function mdc-theme-ink-color-for-fill_($text-style, $fill-color) {
+  $contrast-tone: mdc-theme-contrast-tone($fill-color);
+
+  @return map-get(map-get($mdc-theme-text-colors, $contrast-tone), $text-style);
+}
+
+//
+// Primary text colors for each of the theme colors.
+//
+
+$mdc-theme-property-values: (
+  // Primary
+  primary: $mdc-theme-primary,
+  // Secondary
+  secondary: $mdc-theme-secondary,
+  // Background
+  background: $mdc-theme-background,
+  // Surface
+  surface: $mdc-theme-surface,
+  on-primary: $mdc-theme-on-primary,
+  on-secondary: $mdc-theme-on-secondary,
+  on-surface: $mdc-theme-on-surface,
+  // Text-primary on "background" background
+  text-primary-on-background: mdc-theme-ink-color-for-fill_(primary, $mdc-theme-background),
+  text-secondary-on-background: mdc-theme-ink-color-for-fill_(secondary, $mdc-theme-background),
+  text-hint-on-background: mdc-theme-ink-color-for-fill_(hint, $mdc-theme-background),
+  text-disabled-on-background: mdc-theme-ink-color-for-fill_(disabled, $mdc-theme-background),
+  text-icon-on-background: mdc-theme-ink-color-for-fill_(icon, $mdc-theme-background),
+  // Text-primary on "light" background
+  text-primary-on-light: mdc-theme-ink-color-for-fill_(primary, light),
+  text-secondary-on-light: mdc-theme-ink-color-for-fill_(secondary, light),
+  text-hint-on-light: mdc-theme-ink-color-for-fill_(hint, light),
+  text-disabled-on-light: mdc-theme-ink-color-for-fill_(disabled, light),
+  text-icon-on-light: mdc-theme-ink-color-for-fill_(icon, light),
+  // Text-primary on "dark" background
+  text-primary-on-dark: mdc-theme-ink-color-for-fill_(primary, dark),
+  text-secondary-on-dark: mdc-theme-ink-color-for-fill_(secondary, dark),
+  text-hint-on-dark: mdc-theme-ink-color-for-fill_(hint, dark),
+  text-disabled-on-dark: mdc-theme-ink-color-for-fill_(disabled, dark),
+  text-icon-on-dark: mdc-theme-ink-color-for-fill_(icon, dark)
+);
+
+// If `$style` is a color (a literal color value, `currentColor`, or a CSS custom property), it is returned verbatim.
+// Otherwise, `$style` is treated as a theme property name, and the corresponding value from
+// `$mdc-theme-property-values` is returned. If this also fails, an error is thrown.
+//
+// This is mainly useful in situations where `mdc-theme-prop` cannot be used directly (e.g., `box-shadow`).
+//
+// Examples:
+//
+// 1. mdc-theme-prop-value(primary) => "#6200ee"
+// 2. mdc-theme-prop-value(blue)    => "blue"
+//
+// NOTE: This function must be defined in _variables.scss instead of _functions.scss to avoid circular imports.
+@function mdc-theme-prop-value($style) {
+  @if mdc-theme-is-valid-theme-prop-value_($style) {
+    @return $style;
+  }
+
+  @if not map-has-key($mdc-theme-property-values, $style) {
+    @error "Invalid theme property: '#{$style}'. Choose one of: #{map-keys($mdc-theme-property-values)}";
+  }
+
+  @return map-get($mdc-theme-property-values, $style);
+}
+
+// NOTE: This function must be defined in _variables.scss instead of _functions.scss to avoid circular imports.
+@function mdc-theme-accessible-ink-color($fill-color, $text-style: primary) {
+  $fill-color-value: mdc-theme-prop-value($fill-color);
+  $color-map-for-tone: map-get($mdc-theme-text-colors, mdc-theme-contrast-tone($fill-color-value));
+
+  @if not map-has-key($color-map-for-tone, $text-style) {
+    @error "Invalid $text-style: '#{$text-style}'. Choose one of: #{map-keys($color-map-for-tone)}";
+  }
+
+  @return map-get($color-map-for-tone, $text-style);
+}
+
+// NOTE: This function is depended upon by mdc-theme-prop-value (above) and thus must be defined in this file.
+@function mdc-theme-is-valid-theme-prop-value_($style) {
+  @return type-of($style) == "color" or $style == "currentColor" or str_slice($style, 1, 4) == "var(";
+}
diff --git a/node_modules/@material/floating-label/node_modules/@material/theme/dist/mdc.theme.css b/node_modules/@material/floating-label/node_modules/@material/theme/dist/mdc.theme.css
new file mode 100644
index 0000000..9d4696f
--- /dev/null
+++ b/node_modules/@material/floating-label/node_modules/@material/theme/dist/mdc.theme.css
@@ -0,0 +1,150 @@
+/*!
+ Material Components for the Web
+ Copyright (c) 2018 Google Inc.
+ License: Apache-2.0
+*/
+:root {
+  --mdc-theme-primary: #6200ee;
+  --mdc-theme-secondary: #018786;
+  --mdc-theme-background: #fff;
+  --mdc-theme-surface: #fff;
+  --mdc-theme-on-primary: #fff;
+  --mdc-theme-on-secondary: #fff;
+  --mdc-theme-on-surface: #000;
+  --mdc-theme-text-primary-on-background: rgba(0, 0, 0, 0.87);
+  --mdc-theme-text-secondary-on-background: rgba(0, 0, 0, 0.54);
+  --mdc-theme-text-hint-on-background: rgba(0, 0, 0, 0.38);
+  --mdc-theme-text-disabled-on-background: rgba(0, 0, 0, 0.38);
+  --mdc-theme-text-icon-on-background: rgba(0, 0, 0, 0.38);
+  --mdc-theme-text-primary-on-light: rgba(0, 0, 0, 0.87);
+  --mdc-theme-text-secondary-on-light: rgba(0, 0, 0, 0.54);
+  --mdc-theme-text-hint-on-light: rgba(0, 0, 0, 0.38);
+  --mdc-theme-text-disabled-on-light: rgba(0, 0, 0, 0.38);
+  --mdc-theme-text-icon-on-light: rgba(0, 0, 0, 0.38);
+  --mdc-theme-text-primary-on-dark: white;
+  --mdc-theme-text-secondary-on-dark: rgba(255, 255, 255, 0.7);
+  --mdc-theme-text-hint-on-dark: rgba(255, 255, 255, 0.5);
+  --mdc-theme-text-disabled-on-dark: rgba(255, 255, 255, 0.5);
+  --mdc-theme-text-icon-on-dark: rgba(255, 255, 255, 0.5); }
+
+.mdc-theme--primary {
+  color: #6200ee !important;
+  /* @alternate */
+  color: var(--mdc-theme-primary, #6200ee) !important; }
+
+.mdc-theme--secondary {
+  color: #018786 !important;
+  /* @alternate */
+  color: var(--mdc-theme-secondary, #018786) !important; }
+
+.mdc-theme--background {
+  background-color: #fff;
+  /* @alternate */
+  background-color: var(--mdc-theme-background, #fff); }
+
+.mdc-theme--surface {
+  background-color: #fff;
+  /* @alternate */
+  background-color: var(--mdc-theme-surface, #fff); }
+
+.mdc-theme--on-primary {
+  color: #fff !important;
+  /* @alternate */
+  color: var(--mdc-theme-on-primary, #fff) !important; }
+
+.mdc-theme--on-secondary {
+  color: #fff !important;
+  /* @alternate */
+  color: var(--mdc-theme-on-secondary, #fff) !important; }
+
+.mdc-theme--on-surface {
+  color: #000 !important;
+  /* @alternate */
+  color: var(--mdc-theme-on-surface, #000) !important; }
+
+.mdc-theme--text-primary-on-background {
+  color: rgba(0, 0, 0, 0.87) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-primary-on-background, rgba(0, 0, 0, 0.87)) !important; }
+
+.mdc-theme--text-secondary-on-background {
+  color: rgba(0, 0, 0, 0.54) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-secondary-on-background, rgba(0, 0, 0, 0.54)) !important; }
+
+.mdc-theme--text-hint-on-background {
+  color: rgba(0, 0, 0, 0.38) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-hint-on-background, rgba(0, 0, 0, 0.38)) !important; }
+
+.mdc-theme--text-disabled-on-background {
+  color: rgba(0, 0, 0, 0.38) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-disabled-on-background, rgba(0, 0, 0, 0.38)) !important; }
+
+.mdc-theme--text-icon-on-background {
+  color: rgba(0, 0, 0, 0.38) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-icon-on-background, rgba(0, 0, 0, 0.38)) !important; }
+
+.mdc-theme--text-primary-on-light {
+  color: rgba(0, 0, 0, 0.87) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-primary-on-light, rgba(0, 0, 0, 0.87)) !important; }
+
+.mdc-theme--text-secondary-on-light {
+  color: rgba(0, 0, 0, 0.54) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-secondary-on-light, rgba(0, 0, 0, 0.54)) !important; }
+
+.mdc-theme--text-hint-on-light {
+  color: rgba(0, 0, 0, 0.38) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-hint-on-light, rgba(0, 0, 0, 0.38)) !important; }
+
+.mdc-theme--text-disabled-on-light {
+  color: rgba(0, 0, 0, 0.38) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-disabled-on-light, rgba(0, 0, 0, 0.38)) !important; }
+
+.mdc-theme--text-icon-on-light {
+  color: rgba(0, 0, 0, 0.38) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-icon-on-light, rgba(0, 0, 0, 0.38)) !important; }
+
+.mdc-theme--text-primary-on-dark {
+  color: white !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-primary-on-dark, white) !important; }
+
+.mdc-theme--text-secondary-on-dark {
+  color: rgba(255, 255, 255, 0.7) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-secondary-on-dark, rgba(255, 255, 255, 0.7)) !important; }
+
+.mdc-theme--text-hint-on-dark {
+  color: rgba(255, 255, 255, 0.5) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-hint-on-dark, rgba(255, 255, 255, 0.5)) !important; }
+
+.mdc-theme--text-disabled-on-dark {
+  color: rgba(255, 255, 255, 0.5) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-disabled-on-dark, rgba(255, 255, 255, 0.5)) !important; }
+
+.mdc-theme--text-icon-on-dark {
+  color: rgba(255, 255, 255, 0.5) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-icon-on-dark, rgba(255, 255, 255, 0.5)) !important; }
+
+.mdc-theme--primary-bg {
+  background-color: #6200ee !important;
+  /* @alternate */
+  background-color: var(--mdc-theme-primary, #6200ee) !important; }
+
+.mdc-theme--secondary-bg {
+  background-color: #018786 !important;
+  /* @alternate */
+  background-color: var(--mdc-theme-secondary, #018786) !important; }
+
+/*# sourceMappingURL=mdc.theme.css.map*/
\ No newline at end of file
diff --git a/node_modules/@material/floating-label/node_modules/@material/theme/dist/mdc.theme.min.css b/node_modules/@material/floating-label/node_modules/@material/theme/dist/mdc.theme.min.css
new file mode 100644
index 0000000..88b38e2
--- /dev/null
+++ b/node_modules/@material/floating-label/node_modules/@material/theme/dist/mdc.theme.min.css
@@ -0,0 +1,8 @@
+/*!
+ Material Components for the Web
+ Copyright (c) 2018 Google Inc.
+ License: Apache-2.0
+*/
+:root{--mdc-theme-primary: #6200ee;--mdc-theme-secondary: #018786;--mdc-theme-background: #fff;--mdc-theme-surface: #fff;--mdc-theme-on-primary: #fff;--mdc-theme-on-secondary: #fff;--mdc-theme-on-surface: #000;--mdc-theme-text-primary-on-background: rgba(0,0,0,0.87);--mdc-theme-text-secondary-on-background: rgba(0,0,0,0.54);--mdc-theme-text-hint-on-background: rgba(0,0,0,0.38);--mdc-theme-text-disabled-on-background: rgba(0,0,0,0.38);--mdc-theme-text-icon-on-background: rgba(0,0,0,0.38);--mdc-theme-text-primary-on-light: rgba(0,0,0,0.87);--mdc-theme-text-secondary-on-light: rgba(0,0,0,0.54);--mdc-theme-text-hint-on-light: rgba(0,0,0,0.38);--mdc-theme-text-disabled-on-light: rgba(0,0,0,0.38);--mdc-theme-text-icon-on-light: rgba(0,0,0,0.38);--mdc-theme-text-primary-on-dark: #fff;--mdc-theme-text-secondary-on-dark: rgba(255,255,255,0.7);--mdc-theme-text-hint-on-dark: rgba(255,255,255,0.5);--mdc-theme-text-disabled-on-dark: rgba(255,255,255,0.5);--mdc-theme-text-icon-on-dark: rgba(255,255,255,0.5)}.mdc-theme--primary{color:#6200ee !important;color:var(--mdc-theme-primary, #6200ee) !important}.mdc-theme--secondary{color:#018786 !important;color:var(--mdc-theme-secondary, #018786) !important}.mdc-theme--background{background-color:#fff;background-color:var(--mdc-theme-background, #fff)}.mdc-theme--surface{background-color:#fff;background-color:var(--mdc-theme-surface, #fff)}.mdc-theme--on-primary{color:#fff !important;color:var(--mdc-theme-on-primary, #fff) !important}.mdc-theme--on-secondary{color:#fff !important;color:var(--mdc-theme-on-secondary, #fff) !important}.mdc-theme--on-surface{color:#000 !important;color:var(--mdc-theme-on-surface, #000) !important}.mdc-theme--text-primary-on-background{color:rgba(0,0,0,0.87) !important;color:var(--mdc-theme-text-primary-on-background, rgba(0,0,0,0.87)) !important}.mdc-theme--text-secondary-on-background{color:rgba(0,0,0,0.54) !important;color:var(--mdc-theme-text-secondary-on-background, rgba(0,0,0,0.54)) !important}.mdc-theme--text-hint-on-background{color:rgba(0,0,0,0.38) !important;color:var(--mdc-theme-text-hint-on-background, rgba(0,0,0,0.38)) !important}.mdc-theme--text-disabled-on-background{color:rgba(0,0,0,0.38) !important;color:var(--mdc-theme-text-disabled-on-background, rgba(0,0,0,0.38)) !important}.mdc-theme--text-icon-on-background{color:rgba(0,0,0,0.38) !important;color:var(--mdc-theme-text-icon-on-background, rgba(0,0,0,0.38)) !important}.mdc-theme--text-primary-on-light{color:rgba(0,0,0,0.87) !important;color:var(--mdc-theme-text-primary-on-light, rgba(0,0,0,0.87)) !important}.mdc-theme--text-secondary-on-light{color:rgba(0,0,0,0.54) !important;color:var(--mdc-theme-text-secondary-on-light, rgba(0,0,0,0.54)) !important}.mdc-theme--text-hint-on-light{color:rgba(0,0,0,0.38) !important;color:var(--mdc-theme-text-hint-on-light, rgba(0,0,0,0.38)) !important}.mdc-theme--text-disabled-on-light{color:rgba(0,0,0,0.38) !important;color:var(--mdc-theme-text-disabled-on-light, rgba(0,0,0,0.38)) !important}.mdc-theme--text-icon-on-light{color:rgba(0,0,0,0.38) !important;color:var(--mdc-theme-text-icon-on-light, rgba(0,0,0,0.38)) !important}.mdc-theme--text-primary-on-dark{color:#fff !important;color:var(--mdc-theme-text-primary-on-dark, #fff) !important}.mdc-theme--text-secondary-on-dark{color:rgba(255,255,255,0.7) !important;color:var(--mdc-theme-text-secondary-on-dark, rgba(255,255,255,0.7)) !important}.mdc-theme--text-hint-on-dark{color:rgba(255,255,255,0.5) !important;color:var(--mdc-theme-text-hint-on-dark, rgba(255,255,255,0.5)) !important}.mdc-theme--text-disabled-on-dark{color:rgba(255,255,255,0.5) !important;color:var(--mdc-theme-text-disabled-on-dark, rgba(255,255,255,0.5)) !important}.mdc-theme--text-icon-on-dark{color:rgba(255,255,255,0.5) !important;color:var(--mdc-theme-text-icon-on-dark, rgba(255,255,255,0.5)) !important}.mdc-theme--primary-bg{background-color:#6200ee !important;background-color:var(--mdc-theme-primary, #6200ee) !important}.mdc-theme--secondary-bg{background-color:#018786 !important;background-color:var(--mdc-theme-secondary, #018786) !important}
+
+/*# sourceMappingURL=mdc.theme.min.css.map*/
\ No newline at end of file
diff --git a/node_modules/@material/floating-label/node_modules/@material/theme/mdc-theme.scss b/node_modules/@material/floating-label/node_modules/@material/theme/mdc-theme.scss
new file mode 100644
index 0000000..759aae8
--- /dev/null
+++ b/node_modules/@material/floating-label/node_modules/@material/theme/mdc-theme.scss
@@ -0,0 +1,42 @@
+//
+// Copyright 2017 Google Inc. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+@import "./mixins";
+
+:root {
+  @each $style in map-keys($mdc-theme-property-values) {
+    --mdc-theme-#{$style}: #{map-get($mdc-theme-property-values, $style)};
+  }
+}
+
+@each $style in map-keys($mdc-theme-property-values) {
+  @if $style != "background" and $style != "surface" {
+    .mdc-theme--#{$style} {
+      @include mdc-theme-prop(color, $style, true);
+    }
+  } @else {
+    .mdc-theme--#{$style} {
+      @include mdc-theme-prop(background-color, $style);
+    }
+  }
+}
+
+// CSS rules for using primary and secondary (plus light/dark variants) as background colors.
+@each $style in ("primary", "secondary") {
+  .mdc-theme--#{$style}-bg {
+    @include mdc-theme-prop(background-color, $style, true);
+  }
+}
diff --git a/node_modules/@material/floating-label/node_modules/@material/theme/package.json b/node_modules/@material/floating-label/node_modules/@material/theme/package.json
new file mode 100644
index 0000000..7e10310
--- /dev/null
+++ b/node_modules/@material/floating-label/node_modules/@material/theme/package.json
@@ -0,0 +1,45 @@
+{
+  "_from": "@material/theme@^0.38.0",
+  "_id": "@material/theme@0.38.0",
+  "_inBundle": false,
+  "_integrity": "sha512-mP5+qgICPm/0dD3hKa/hMd8AHerkAaLJgEsvBwTXi+N/kpPo9LIrHg40DvUGPs5w6KD9PUuskb3WGBvYcToHvA==",
+  "_location": "/@material/floating-label/@material/theme",
+  "_phantomChildren": {},
+  "_requested": {
+    "type": "range",
+    "registry": true,
+    "raw": "@material/theme@^0.38.0",
+    "name": "@material/theme",
+    "escapedName": "@material%2ftheme",
+    "scope": "@material",
+    "rawSpec": "^0.38.0",
+    "saveSpec": null,
+    "fetchSpec": "^0.38.0"
+  },
+  "_requiredBy": [
+    "/@material/floating-label"
+  ],
+  "_resolved": "https://registry.npmjs.org/@material/theme/-/theme-0.38.0.tgz",
+  "_shasum": "c1a2247eba4af2ba47da4456921ab420869fda55",
+  "_spec": "@material/theme@^0.38.0",
+  "_where": "C:\\Users\\jakch\\github\\tool-hub\\node_modules\\@material\\floating-label",
+  "bugs": {
+    "url": "https://github.com/material-components/material-components-web/issues"
+  },
+  "bundleDependencies": false,
+  "deprecated": false,
+  "description": "The Material Components for the web theming system",
+  "homepage": "https://github.com/material-components/material-components-web#readme",
+  "keywords": [
+    "material components",
+    "material design",
+    "theme"
+  ],
+  "license": "Apache-2.0",
+  "name": "@material/theme",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/material-components/material-components-web.git"
+  },
+  "version": "0.38.0"
+}
diff --git a/node_modules/@material/floating-label/package.json b/node_modules/@material/floating-label/package.json
new file mode 100644
index 0000000..85e2b52
--- /dev/null
+++ b/node_modules/@material/floating-label/package.json
@@ -0,0 +1,56 @@
+{
+  "_from": "@material/floating-label@^0.38.0",
+  "_id": "@material/floating-label@0.38.0",
+  "_inBundle": false,
+  "_integrity": "sha512-ga+7ELYrkiRYMHqkLOnCKaQUvGowMYXqML3I7hBhs3eEchTjx42U7bfTSqbfdiNG1F9+cOcSOWTKug2VOkYlkg==",
+  "_location": "/@material/floating-label",
+  "_phantomChildren": {},
+  "_requested": {
+    "type": "range",
+    "registry": true,
+    "raw": "@material/floating-label@^0.38.0",
+    "name": "@material/floating-label",
+    "escapedName": "@material%2ffloating-label",
+    "scope": "@material",
+    "rawSpec": "^0.38.0",
+    "saveSpec": null,
+    "fetchSpec": "^0.38.0"
+  },
+  "_requiredBy": [
+    "/@material/textfield"
+  ],
+  "_resolved": "https://registry.npmjs.org/@material/floating-label/-/floating-label-0.38.0.tgz",
+  "_shasum": "557771f8b9d05d0cd7ec6b3bb13ebb0d24d65ab5",
+  "_spec": "@material/floating-label@^0.38.0",
+  "_where": "C:\\Users\\jakch\\github\\tool-hub\\node_modules\\@material\\textfield",
+  "bugs": {
+    "url": "https://github.com/material-components/material-components-web/issues"
+  },
+  "bundleDependencies": false,
+  "dependencies": {
+    "@material/base": "^0.35.0",
+    "@material/rtl": "^0.36.0",
+    "@material/theme": "^0.38.0",
+    "@material/typography": "^0.38.0"
+  },
+  "deprecated": false,
+  "description": "The Material Components for the web floating-label component",
+  "homepage": "https://github.com/material-components/material-components-web#readme",
+  "keywords": [
+    "material components",
+    "material design",
+    "floatinglabel",
+    "floating label"
+  ],
+  "license": "Apache-2.0",
+  "main": "index.js",
+  "name": "@material/floating-label",
+  "publishConfig": {
+    "access": "public"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/material-components/material-components-web.git"
+  },
+  "version": "0.38.0"
+}
diff --git a/node_modules/@material/line-ripple/README.md b/node_modules/@material/line-ripple/README.md
new file mode 100644
index 0000000..2ebfadf
--- /dev/null
+++ b/node_modules/@material/line-ripple/README.md
@@ -0,0 +1,91 @@
+<!--docs:
+title: "Line Ripple"
+layout: detail
+section: components
+excerpt: "The line ripple is used to highlight user-specified input above it."
+path: /catalog/input-controls/line-ripple/
+-->
+
+# Line Ripple
+
+The line ripple is used to highlight user-specified input above it. When a line ripple is active, the line’s color and thickness changes.
+
+## Design & API Documentation
+
+<ul class="icon-list">
+  <li class="icon-list-item icon-list-item--spec">
+    <a href="https://material.io/go/design-text-fields#text-fields-layout">Material Design guidelines: Text Fields Layout</a>
+  </li>
+  <li class="icon-list-item icon-list-item--spec">
+    <a href="https://material-components.github.io/material-components-web-catalog/#/component/text-field">Demo with Line Ripple on Text Field</a>
+  </li>
+</ul>
+
+## Basic Usage
+
+### HTML Structure
+
+```html
+<div class="mdc-line-ripple"></div>
+```
+
+### Styles
+
+```scss
+@import "@material/line-ripple/mdc-line-ripple";
+```
+
+### JavaScript Instantiation
+
+```js
+import {MDCLineRipple} from '@material/line-ripple';
+
+const lineRipple = new MDCLineRipple(document.querySelector('.mdc-line-ripple'));
+```
+
+## Style Customization
+
+### CSS Classes
+
+CSS Class | Description
+--- | ---
+`mdc-line-ripple` | Mandatory.
+`mdc-line-ripple--active` | Styles the line ripple as an active line ripple.
+`mdc-line-ripple--deactivating` | Styles the line ripple as a deactivating line ripple.
+
+### Sass Mixins
+
+Mixin | Description
+--- | ---
+`mdc-line-ripple-color($color)` | Customizes the color of the line ripple when active.
+
+## `MDCLineRipple` Properties and Methods
+
+Method Signature | Description
+--- | ---
+`activate() => void` | Proxies to the foundation's `activate()` method.
+`deactivate() => void` | Proxies to the foundation's `deactivate()` method.
+`setRippleCenter(xCoordinate: number) => void` | Proxies to the foundation's `setRippleCenter(xCoordinate: number)` method.
+
+## Usage Within Frameworks
+
+If you are using a JavaScript framework, such as React or Angular, you can create a Line Ripple for your framework. Depending on your needs, you can use the _Simple Approach: Wrapping MDC Web Vanilla Components_, or the _Advanced Approach: Using Foundations and Adapters_. Please follow the instructions [here](../../docs/integrating-into-frameworks.md).
+
+### `MDCLineRippleAdapter`
+
+Method Signature | Description
+--- | ---
+`addClass(className: string) => void` | Adds a class to the root element.
+`removeClass(className: string) => void` | Removes a class from the root element.
+`setStyle(propertyName: string, value: string) => void` | Sets the style property with `propertyName` to `value` on the root element.
+`registerEventHandler(evtType: string, handler: EventListener) => void` | Registers an event listener on the root element for a given event.
+`deregisterEventHandler(handler: EventListener) => void` | Deregisters an event listener on the root element for a given event.
+
+### `MDCLineRippleFoundation`
+
+Method Signature | Description
+--- | ---
+`activate() => void` | Activates the line ripple.
+`deactivate() => void` |  Deactivates the line ripple.
+`setRippleCenter(xCoordinate: number) => void` | Sets the center of the ripple to the `xCoordinate` given.
+`handleTransitionEnd(evt: Event) => void` | Handles a `transitionend` event.
diff --git a/node_modules/@material/line-ripple/_functions.scss b/node_modules/@material/line-ripple/_functions.scss
new file mode 100644
index 0000000..45ff870
--- /dev/null
+++ b/node_modules/@material/line-ripple/_functions.scss
@@ -0,0 +1,21 @@
+//
+// Copyright 2018 Google Inc. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+@import "@material/animation/variables";
+
+@function mdc-line-ripple-transition-value($property) {
+  @return #{$property} 180ms $mdc-animation-standard-curve-timing-function;
+}
diff --git a/node_modules/@material/line-ripple/_mixins.scss b/node_modules/@material/line-ripple/_mixins.scss
new file mode 100644
index 0000000..32cae00
--- /dev/null
+++ b/node_modules/@material/line-ripple/_mixins.scss
@@ -0,0 +1,21 @@
+//
+// Copyright 2018 Google Inc. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+// Public
+
+@mixin mdc-line-ripple-color($color) {
+  @include mdc-theme-prop(background-color, $color);
+}
diff --git a/node_modules/@material/line-ripple/adapter.js b/node_modules/@material/line-ripple/adapter.js
new file mode 100644
index 0000000..c424ea1
--- /dev/null
+++ b/node_modules/@material/line-ripple/adapter.js
@@ -0,0 +1,71 @@
+/**
+ * @license
+ * Copyright 2018 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/* eslint no-unused-vars: [2, {"args": "none"}] */
+
+/**
+ * Adapter for MDC TextField Line Ripple.
+ *
+ * Defines the shape of the adapter expected by the foundation. Implement this
+ * adapter to integrate the line ripple into your framework. See
+ * https://github.com/material-components/material-components-web/blob/master/docs/authoring-components.md
+ * for more information.
+ *
+ * @record
+ */
+class MDCLineRippleAdapter {
+  /**
+   * Adds a class to the line ripple element.
+   * @param {string} className
+   */
+  addClass(className) {}
+
+  /**
+   * Removes a class from the line ripple element.
+   * @param {string} className
+   */
+  removeClass(className) {}
+
+  /**
+   * @param {string} className
+   * @return {boolean}
+   */
+  hasClass(className) {}
+
+  /**
+   * Sets the style property with propertyName to value on the root element.
+   * @param {string} propertyName
+   * @param {string} value
+   */
+  setStyle(propertyName, value) {}
+
+  /**
+   * Registers an event listener on the line ripple element for a given event.
+   * @param {string} evtType
+   * @param {function(!Event): undefined} handler
+   */
+  registerEventHandler(evtType, handler) {}
+
+  /**
+   * Deregisters an event listener on the line ripple element for a given event.
+   * @param {string} evtType
+   * @param {function(!Event): undefined} handler
+   */
+  deregisterEventHandler(evtType, handler) {}
+}
+
+export default MDCLineRippleAdapter;
diff --git a/node_modules/@material/line-ripple/constants.js b/node_modules/@material/line-ripple/constants.js
new file mode 100644
index 0000000..d640497
--- /dev/null
+++ b/node_modules/@material/line-ripple/constants.js
@@ -0,0 +1,24 @@
+/**
+ * @license
+ * Copyright 2018 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/** @enum {string} */
+const cssClasses = {
+  LINE_RIPPLE_ACTIVE: 'mdc-line-ripple--active',
+  LINE_RIPPLE_DEACTIVATING: 'mdc-line-ripple--deactivating',
+};
+
+export {cssClasses};
diff --git a/node_modules/@material/line-ripple/dist/mdc.line-ripple.css b/node_modules/@material/line-ripple/dist/mdc.line-ripple.css
new file mode 100644
index 0000000..1a4a275
--- /dev/null
+++ b/node_modules/@material/line-ripple/dist/mdc.line-ripple.css
@@ -0,0 +1,28 @@
+/*!
+ Material Components for the Web
+ Copyright (c) 2018 Google Inc.
+ License: Apache-2.0
+*/
+.mdc-line-ripple {
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  width: 100%;
+  height: 2px;
+  -webkit-transform: scaleX(0);
+          transform: scaleX(0);
+  transition: opacity 180ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 180ms cubic-bezier(0.4, 0, 0.2, 1);
+  transition: transform 180ms cubic-bezier(0.4, 0, 0.2, 1), opacity 180ms cubic-bezier(0.4, 0, 0.2, 1);
+  transition: transform 180ms cubic-bezier(0.4, 0, 0.2, 1), opacity 180ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 180ms cubic-bezier(0.4, 0, 0.2, 1);
+  opacity: 0;
+  z-index: 2; }
+
+.mdc-line-ripple--active {
+  -webkit-transform: scaleX(1);
+          transform: scaleX(1);
+  opacity: 1; }
+
+.mdc-line-ripple--deactivating {
+  opacity: 0; }
+
+/*# sourceMappingURL=mdc.line-ripple.css.map*/
\ No newline at end of file
diff --git a/node_modules/@material/line-ripple/dist/mdc.line-ripple.min.css b/node_modules/@material/line-ripple/dist/mdc.line-ripple.min.css
new file mode 100644
index 0000000..39bd47e
--- /dev/null
+++ b/node_modules/@material/line-ripple/dist/mdc.line-ripple.min.css
@@ -0,0 +1,8 @@
+/*!
+ Material Components for the Web
+ Copyright (c) 2018 Google Inc.
+ License: Apache-2.0
+*/
+.mdc-line-ripple{position:absolute;bottom:0;left:0;width:100%;height:2px;-webkit-transform:scaleX(0);transform:scaleX(0);transition:opacity 180ms cubic-bezier(0.4, 0, 0.2, 1),-webkit-transform 180ms cubic-bezier(0.4, 0, 0.2, 1);transition:transform 180ms cubic-bezier(0.4, 0, 0.2, 1),opacity 180ms cubic-bezier(0.4, 0, 0.2, 1);transition:transform 180ms cubic-bezier(0.4, 0, 0.2, 1),opacity 180ms cubic-bezier(0.4, 0, 0.2, 1),-webkit-transform 180ms cubic-bezier(0.4, 0, 0.2, 1);opacity:0;z-index:2}.mdc-line-ripple--active{-webkit-transform:scaleX(1);transform:scaleX(1);opacity:1}.mdc-line-ripple--deactivating{opacity:0}
+
+/*# sourceMappingURL=mdc.line-ripple.min.css.map*/
\ No newline at end of file
diff --git a/node_modules/@material/line-ripple/dist/mdc.lineRipple.js b/node_modules/@material/line-ripple/dist/mdc.lineRipple.js
new file mode 100644
index 0000000..50c2ea0
--- /dev/null
+++ b/node_modules/@material/line-ripple/dist/mdc.lineRipple.js
@@ -0,0 +1,804 @@
+/*!
+ Material Components for the Web
+ Copyright (c) 2018 Google Inc.
+ License: Apache-2.0
+*/
+(function webpackUniversalModuleDefinition(root, factory) {
+	if(typeof exports === 'object' && typeof module === 'object')
+		module.exports = factory();
+	else if(typeof define === 'function' && define.amd)
+		define([], factory);
+	else if(typeof exports === 'object')
+		exports["lineRipple"] = factory();
+	else
+		root["mdc"] = root["mdc"] || {}, root["mdc"]["lineRipple"] = factory();
+})(this, function() {
+return /******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, {
+/******/ 				configurable: false,
+/******/ 				enumerable: true,
+/******/ 				get: getter
+/******/ 			});
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "";
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = 22);
+/******/ })
+/************************************************************************/
+/******/ ({
+
+/***/ 0:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * @license
+ * Copyright 2016 Google Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * @template A
+ */
+var MDCFoundation = function () {
+  _createClass(MDCFoundation, null, [{
+    key: "cssClasses",
+
+    /** @return enum{cssClasses} */
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports every
+      // CSS class the foundation class needs as a property. e.g. {ACTIVE: 'mdc-component--active'}
+      return {};
+    }
+
+    /** @return enum{strings} */
+
+  }, {
+    key: "strings",
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports all
+      // semantic strings as constants. e.g. {ARIA_ROLE: 'tablist'}
+      return {};
+    }
+
+    /** @return enum{numbers} */
+
+  }, {
+    key: "numbers",
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports all
+      // of its semantic numbers as constants. e.g. {ANIMATION_DELAY_MS: 350}
+      return {};
+    }
+
+    /** @return {!Object} */
+
+  }, {
+    key: "defaultAdapter",
+    get: function get() {
+      // Classes extending MDCFoundation may choose to implement this getter in order to provide a convenient
+      // way of viewing the necessary methods of an adapter. In the future, this could also be used for adapter
+      // validation.
+      return {};
+    }
+
+    /**
+     * @param {A=} adapter
+     */
+
+  }]);
+
+  function MDCFoundation() {
+    var adapter = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+
+    _classCallCheck(this, MDCFoundation);
+
+    /** @protected {!A} */
+    this.adapter_ = adapter;
+  }
+
+  _createClass(MDCFoundation, [{
+    key: "init",
+    value: function init() {
+      // Subclasses should override this method to perform initialization routines (registering events, etc.)
+    }
+  }, {
+    key: "destroy",
+    value: function destroy() {
+      // Subclasses should override this method to perform de-initialization routines (de-registering events, etc.)
+    }
+  }]);
+
+  return MDCFoundation;
+}();
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCFoundation);
+
+/***/ }),
+
+/***/ 1:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__foundation__ = __webpack_require__(0);
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * @license
+ * Copyright 2016 Google Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+/**
+ * @template F
+ */
+
+var MDCComponent = function () {
+  _createClass(MDCComponent, null, [{
+    key: 'attachTo',
+
+    /**
+     * @param {!Element} root
+     * @return {!MDCComponent}
+     */
+    value: function attachTo(root) {
+      // Subclasses which extend MDCBase should provide an attachTo() method that takes a root element and
+      // returns an instantiated component with its root set to that element. Also note that in the cases of
+      // subclasses, an explicit foundation class will not have to be passed in; it will simply be initialized
+      // from getDefaultFoundation().
+      return new MDCComponent(root, new __WEBPACK_IMPORTED_MODULE_0__foundation__["a" /* default */]());
+    }
+
+    /**
+     * @param {!Element} root
+     * @param {F=} foundation
+     * @param {...?} args
+     */
+
+  }]);
+
+  function MDCComponent(root) {
+    var foundation = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : undefined;
+
+    _classCallCheck(this, MDCComponent);
+
+    /** @protected {!Element} */
+    this.root_ = root;
+
+    for (var _len = arguments.length, args = Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++) {
+      args[_key - 2] = arguments[_key];
+    }
+
+    this.initialize.apply(this, args);
+    // Note that we initialize foundation here and not within the constructor's default param so that
+    // this.root_ is defined and can be used within the foundation class.
+    /** @protected {!F} */
+    this.foundation_ = foundation === undefined ? this.getDefaultFoundation() : foundation;
+    this.foundation_.init();
+    this.initialSyncWithDOM();
+  }
+
+  _createClass(MDCComponent, [{
+    key: 'initialize',
+    value: function initialize() /* ...args */{}
+    // Subclasses can override this to do any additional setup work that would be considered part of a
+    // "constructor". Essentially, it is a hook into the parent constructor before the foundation is
+    // initialized. Any additional arguments besides root and foundation will be passed in here.
+
+
+    /**
+     * @return {!F} foundation
+     */
+
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      // Subclasses must override this method to return a properly configured foundation class for the
+      // component.
+      throw new Error('Subclasses must override getDefaultFoundation to return a properly configured ' + 'foundation class');
+    }
+  }, {
+    key: 'initialSyncWithDOM',
+    value: function initialSyncWithDOM() {
+      // Subclasses should override this method if they need to perform work to synchronize with a host DOM
+      // object. An example of this would be a form control wrapper that needs to synchronize its internal state
+      // to some property or attribute of the host DOM. Please note: this is *not* the place to perform DOM
+      // reads/writes that would cause layout / paint, as this is called synchronously from within the constructor.
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      // Subclasses may implement this method to release any resources / deregister any listeners they have
+      // attached. An example of this might be deregistering a resize event from the window object.
+      this.foundation_.destroy();
+    }
+
+    /**
+     * Wrapper method to add an event listener to the component's root element. This is most useful when
+     * listening for custom events.
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: 'listen',
+    value: function listen(evtType, handler) {
+      this.root_.addEventListener(evtType, handler);
+    }
+
+    /**
+     * Wrapper method to remove an event listener to the component's root element. This is most useful when
+     * unlistening for custom events.
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: 'unlisten',
+    value: function unlisten(evtType, handler) {
+      this.root_.removeEventListener(evtType, handler);
+    }
+
+    /**
+     * Fires a cross-browser-compatible custom event from the component root of the given type,
+     * with the given data.
+     * @param {string} evtType
+     * @param {!Object} evtData
+     * @param {boolean=} shouldBubble
+     */
+
+  }, {
+    key: 'emit',
+    value: function emit(evtType, evtData) {
+      var shouldBubble = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
+
+      var evt = void 0;
+      if (typeof CustomEvent === 'function') {
+        evt = new CustomEvent(evtType, {
+          detail: evtData,
+          bubbles: shouldBubble
+        });
+      } else {
+        evt = document.createEvent('CustomEvent');
+        evt.initCustomEvent(evtType, shouldBubble, false, evtData);
+      }
+
+      this.root_.dispatchEvent(evt);
+    }
+  }]);
+
+  return MDCComponent;
+}();
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCComponent);
+
+/***/ }),
+
+/***/ 14:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * @license
+ * Copyright 2018 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/* eslint no-unused-vars: [2, {"args": "none"}] */
+
+/**
+ * Adapter for MDC TextField Line Ripple.
+ *
+ * Defines the shape of the adapter expected by the foundation. Implement this
+ * adapter to integrate the line ripple into your framework. See
+ * https://github.com/material-components/material-components-web/blob/master/docs/authoring-components.md
+ * for more information.
+ *
+ * @record
+ */
+var MDCLineRippleAdapter = function () {
+  function MDCLineRippleAdapter() {
+    _classCallCheck(this, MDCLineRippleAdapter);
+  }
+
+  _createClass(MDCLineRippleAdapter, [{
+    key: "addClass",
+
+    /**
+     * Adds a class to the line ripple element.
+     * @param {string} className
+     */
+    value: function addClass(className) {}
+
+    /**
+     * Removes a class from the line ripple element.
+     * @param {string} className
+     */
+
+  }, {
+    key: "removeClass",
+    value: function removeClass(className) {}
+
+    /**
+     * @param {string} className
+     * @return {boolean}
+     */
+
+  }, {
+    key: "hasClass",
+    value: function hasClass(className) {}
+
+    /**
+     * Sets the style property with propertyName to value on the root element.
+     * @param {string} propertyName
+     * @param {string} value
+     */
+
+  }, {
+    key: "setStyle",
+    value: function setStyle(propertyName, value) {}
+
+    /**
+     * Registers an event listener on the line ripple element for a given event.
+     * @param {string} evtType
+     * @param {function(!Event): undefined} handler
+     */
+
+  }, {
+    key: "registerEventHandler",
+    value: function registerEventHandler(evtType, handler) {}
+
+    /**
+     * Deregisters an event listener on the line ripple element for a given event.
+     * @param {string} evtType
+     * @param {function(!Event): undefined} handler
+     */
+
+  }, {
+    key: "deregisterEventHandler",
+    value: function deregisterEventHandler(evtType, handler) {}
+  }]);
+
+  return MDCLineRippleAdapter;
+}();
+
+/* unused harmony default export */ var _unused_webpack_default_export = (MDCLineRippleAdapter);
+
+/***/ }),
+
+/***/ 22:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MDCLineRipple", function() { return MDCLineRipple; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_component__ = __webpack_require__(1);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__adapter__ = __webpack_require__(14);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__foundation__ = __webpack_require__(23);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCLineRippleFoundation", function() { return __WEBPACK_IMPORTED_MODULE_2__foundation__["a"]; });
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * @license
+ * Copyright 2018 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+/**
+ * @extends {MDCComponent<!MDCLineRippleFoundation>}
+ * @final
+ */
+
+var MDCLineRipple = function (_MDCComponent) {
+  _inherits(MDCLineRipple, _MDCComponent);
+
+  function MDCLineRipple() {
+    _classCallCheck(this, MDCLineRipple);
+
+    return _possibleConstructorReturn(this, (MDCLineRipple.__proto__ || Object.getPrototypeOf(MDCLineRipple)).apply(this, arguments));
+  }
+
+  _createClass(MDCLineRipple, [{
+    key: 'activate',
+
+
+    /**
+     * Activates the line ripple
+     */
+    value: function activate() {
+      this.foundation_.activate();
+    }
+
+    /**
+     * Deactivates the line ripple
+     */
+
+  }, {
+    key: 'deactivate',
+    value: function deactivate() {
+      this.foundation_.deactivate();
+    }
+
+    /**
+     * Sets the transform origin given a user's click location. The `rippleCenter` is the
+     * x-coordinate of the middle of the ripple.
+     * @param {number} xCoordinate
+     */
+
+  }, {
+    key: 'setRippleCenter',
+    value: function setRippleCenter(xCoordinate) {
+      this.foundation_.setRippleCenter(xCoordinate);
+    }
+
+    /**
+     * @return {!MDCLineRippleFoundation}
+     */
+
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      var _this2 = this;
+
+      return new __WEBPACK_IMPORTED_MODULE_2__foundation__["a" /* default */]( /** @type {!MDCLineRippleAdapter} */_extends({
+        addClass: function addClass(className) {
+          return _this2.root_.classList.add(className);
+        },
+        removeClass: function removeClass(className) {
+          return _this2.root_.classList.remove(className);
+        },
+        hasClass: function hasClass(className) {
+          return _this2.root_.classList.contains(className);
+        },
+        setStyle: function setStyle(propertyName, value) {
+          return _this2.root_.style[propertyName] = value;
+        },
+        registerEventHandler: function registerEventHandler(evtType, handler) {
+          return _this2.root_.addEventListener(evtType, handler);
+        },
+        deregisterEventHandler: function deregisterEventHandler(evtType, handler) {
+          return _this2.root_.removeEventListener(evtType, handler);
+        }
+      }));
+    }
+  }], [{
+    key: 'attachTo',
+
+    /**
+     * @param {!Element} root
+     * @return {!MDCLineRipple}
+     */
+    value: function attachTo(root) {
+      return new MDCLineRipple(root);
+    }
+  }]);
+
+  return MDCLineRipple;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_component__["a" /* default */]);
+
+
+
+/***/ }),
+
+/***/ 23:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_foundation__ = __webpack_require__(0);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__adapter__ = __webpack_require__(14);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__constants__ = __webpack_require__(24);
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * @license
+ * Copyright 2018 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+/**
+ * @extends {MDCFoundation<!MDCLineRippleAdapter>}
+ * @final
+ */
+
+var MDCLineRippleFoundation = function (_MDCFoundation) {
+  _inherits(MDCLineRippleFoundation, _MDCFoundation);
+
+  _createClass(MDCLineRippleFoundation, null, [{
+    key: 'cssClasses',
+
+    /** @return enum {string} */
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */];
+    }
+
+    /**
+     * {@see MDCLineRippleAdapter} for typing information on parameters and return
+     * types.
+     * @return {!MDCLineRippleAdapter}
+     */
+
+  }, {
+    key: 'defaultAdapter',
+    get: function get() {
+      return (/** @type {!MDCLineRippleAdapter} */{
+          addClass: function addClass() {},
+          removeClass: function removeClass() {},
+          hasClass: function hasClass() {},
+          setStyle: function setStyle() {},
+          registerEventHandler: function registerEventHandler() {},
+          deregisterEventHandler: function deregisterEventHandler() {}
+        }
+      );
+    }
+
+    /**
+     * @param {!MDCLineRippleAdapter=} adapter
+     */
+
+  }]);
+
+  function MDCLineRippleFoundation() {
+    var adapter = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : /** @type {!MDCLineRippleAdapter} */{};
+
+    _classCallCheck(this, MDCLineRippleFoundation);
+
+    /** @private {function(!Event): undefined} */
+    var _this = _possibleConstructorReturn(this, (MDCLineRippleFoundation.__proto__ || Object.getPrototypeOf(MDCLineRippleFoundation)).call(this, _extends(MDCLineRippleFoundation.defaultAdapter, adapter)));
+
+    _this.transitionEndHandler_ = function (evt) {
+      return _this.handleTransitionEnd(evt);
+    };
+    return _this;
+  }
+
+  _createClass(MDCLineRippleFoundation, [{
+    key: 'init',
+    value: function init() {
+      this.adapter_.registerEventHandler('transitionend', this.transitionEndHandler_);
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      this.adapter_.deregisterEventHandler('transitionend', this.transitionEndHandler_);
+    }
+
+    /**
+     * Activates the line ripple
+     */
+
+  }, {
+    key: 'activate',
+    value: function activate() {
+      this.adapter_.removeClass(__WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */].LINE_RIPPLE_DEACTIVATING);
+      this.adapter_.addClass(__WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */].LINE_RIPPLE_ACTIVE);
+    }
+
+    /**
+     * Sets the center of the ripple animation to the given X coordinate.
+     * @param {number} xCoordinate
+     */
+
+  }, {
+    key: 'setRippleCenter',
+    value: function setRippleCenter(xCoordinate) {
+      this.adapter_.setStyle('transform-origin', xCoordinate + 'px center');
+    }
+
+    /**
+     * Deactivates the line ripple
+     */
+
+  }, {
+    key: 'deactivate',
+    value: function deactivate() {
+      this.adapter_.addClass(__WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */].LINE_RIPPLE_DEACTIVATING);
+    }
+
+    /**
+     * Handles a transition end event
+     * @param {!Event} evt
+     */
+
+  }, {
+    key: 'handleTransitionEnd',
+    value: function handleTransitionEnd(evt) {
+      // Wait for the line ripple to be either transparent or opaque
+      // before emitting the animation end event
+      var isDeactivating = this.adapter_.hasClass(__WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */].LINE_RIPPLE_DEACTIVATING);
+
+      if (evt.propertyName === 'opacity') {
+        if (isDeactivating) {
+          this.adapter_.removeClass(__WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */].LINE_RIPPLE_ACTIVE);
+          this.adapter_.removeClass(__WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */].LINE_RIPPLE_DEACTIVATING);
+        }
+      }
+    }
+  }]);
+
+  return MDCLineRippleFoundation;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_foundation__["a" /* default */]);
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCLineRippleFoundation);
+
+/***/ }),
+
+/***/ 24:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return cssClasses; });
+/**
+ * @license
+ * Copyright 2018 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/** @enum {string} */
+var cssClasses = {
+  LINE_RIPPLE_ACTIVE: 'mdc-line-ripple--active',
+  LINE_RIPPLE_DEACTIVATING: 'mdc-line-ripple--deactivating'
+};
+
+
+
+/***/ })
+
+/******/ });
+});
+//# sourceMappingURL=mdc.lineRipple.js.map
\ No newline at end of file
diff --git a/node_modules/@material/line-ripple/dist/mdc.lineRipple.min.js b/node_modules/@material/line-ripple/dist/mdc.lineRipple.min.js
new file mode 100644
index 0000000..7ace29b
--- /dev/null
+++ b/node_modules/@material/line-ripple/dist/mdc.lineRipple.min.js
@@ -0,0 +1,23 @@
+/*!
+ Material Components for the Web
+ Copyright (c) 2018 Google Inc.
+ License: Apache-2.0
+*/
+!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.lineRipple=t():(e.mdc=e.mdc||{},e.mdc.lineRipple=t())}(this,function(){return function(e){function t(r){if(n[r])return n[r].exports;var o=n[r]={i:r,l:!1,exports:{}};return e[r].call(o.exports,o,o.exports,t),o.l=!0,o.exports}var n={};return t.m=e,t.c=n,t.d=function(e,n,r){t.o(e,n)||Object.defineProperty(e,n,{configurable:!1,enumerable:!0,get:r})},t.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(n,"a",n),n},t.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},t.p="",t(t.s=22)}({0:function(e,t,n){"use strict";function r(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}var o=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),i=function(){function e(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};r(this,e),this.adapter_=t}return o(e,null,[{key:"cssClasses",get:function(){return{}}},{key:"strings",get:function(){return{}}},{key:"numbers",get:function(){return{}}},{key:"defaultAdapter",get:function(){return{}}}]),o(e,[{key:"init",value:function(){}},{key:"destroy",value:function(){}}]),e}();t.a=i},1:function(e,t,n){"use strict";function r(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}var o=n(0),i=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),a=function(){function e(t){var n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:void 0;r(this,e),this.root_=t;for(var o=arguments.length,i=Array(o>2?o-2:0),a=2;a<o;a++)i[a-2]=arguments[a];this.initialize.apply(this,i),this.foundation_=void 0===n?this.getDefaultFoundation():n,this.foundation_.init(),this.initialSyncWithDOM()}return i(e,null,[{key:"attachTo",value:function(t){return new e(t,new o.a)}}]),i(e,[{key:"initialize",value:function(){}},{key:"getDefaultFoundation",value:function(){throw new Error("Subclasses must override getDefaultFoundation to return a properly configured foundation class")}},{key:"initialSyncWithDOM",value:function(){}},{key:"destroy",value:function(){this.foundation_.destroy()}},{key:"listen",value:function(e,t){this.root_.addEventListener(e,t)}},{key:"unlisten",value:function(e,t){this.root_.removeEventListener(e,t)}},{key:"emit",value:function(e,t){var n=arguments.length>2&&void 0!==arguments[2]&&arguments[2],r=void 0;"function"==typeof CustomEvent?r=new CustomEvent(e,{detail:t,bubbles:n}):(r=document.createEvent("CustomEvent"),r.initCustomEvent(e,n,!1,t)),this.root_.dispatchEvent(r)}}]),e}();t.a=a},14:function(e,t,n){"use strict";function r(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}var o=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}();!function(){function e(){r(this,e)}o(e,[{key:"addClass",value:function(e){}},{key:"removeClass",value:function(e){}},{key:"hasClass",value:function(e){}},{key:"setStyle",value:function(e,t){}},{key:"registerEventHandler",value:function(e,t){}},{key:"deregisterEventHandler",value:function(e,t){}}])}()},22:function(e,t,n){"use strict";function r(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function o(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function i(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0}),n.d(t,"MDCLineRipple",function(){return l});var a=n(1),u=(n(14),n(23));n.d(t,"MDCLineRippleFoundation",function(){return u.a});var c=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},s=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),l=function(e){function t(){return r(this,t),o(this,(t.__proto__||Object.getPrototypeOf(t)).apply(this,arguments))}return i(t,e),s(t,[{key:"activate",value:function(){this.foundation_.activate()}},{key:"deactivate",value:function(){this.foundation_.deactivate()}},{key:"setRippleCenter",value:function(e){this.foundation_.setRippleCenter(e)}},{key:"getDefaultFoundation",value:function(){var e=this;return new u.a(c({addClass:function(t){return e.root_.classList.add(t)},removeClass:function(t){return e.root_.classList.remove(t)},hasClass:function(t){return e.root_.classList.contains(t)},setStyle:function(t,n){return e.root_.style[t]=n},registerEventHandler:function(t,n){return e.root_.addEventListener(t,n)},deregisterEventHandler:function(t,n){return e.root_.removeEventListener(t,n)}}))}}],[{key:"attachTo",value:function(e){return new t(e)}}]),t}(a.a)},23:function(e,t,n){"use strict";function r(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function o(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function i(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}var a=n(0),u=(n(14),n(24)),c=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},s=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),l=function(e){function t(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};r(this,t);var n=o(this,(t.__proto__||Object.getPrototypeOf(t)).call(this,c(t.defaultAdapter,e)));return n.transitionEndHandler_=function(e){return n.handleTransitionEnd(e)},n}return i(t,e),s(t,null,[{key:"cssClasses",get:function(){return u.a}},{key:"defaultAdapter",get:function(){return{addClass:function(){},removeClass:function(){},hasClass:function(){},setStyle:function(){},registerEventHandler:function(){},deregisterEventHandler:function(){}}}}]),s(t,[{key:"init",value:function(){this.adapter_.registerEventHandler("transitionend",this.transitionEndHandler_)}},{key:"destroy",value:function(){this.adapter_.deregisterEventHandler("transitionend",this.transitionEndHandler_)}},{key:"activate",value:function(){this.adapter_.removeClass(u.a.LINE_RIPPLE_DEACTIVATING),this.adapter_.addClass(u.a.LINE_RIPPLE_ACTIVE)}},{key:"setRippleCenter",value:function(e){this.adapter_.setStyle("transform-origin",e+"px center")}},{key:"deactivate",value:function(){this.adapter_.addClass(u.a.LINE_RIPPLE_DEACTIVATING)}},{key:"handleTransitionEnd",value:function(e){var t=this.adapter_.hasClass(u.a.LINE_RIPPLE_DEACTIVATING);"opacity"===e.propertyName&&t&&(this.adapter_.removeClass(u.a.LINE_RIPPLE_ACTIVE),this.adapter_.removeClass(u.a.LINE_RIPPLE_DEACTIVATING))}}]),t}(a.a);t.a=l},24:function(e,t,n){"use strict";n.d(t,"a",function(){return r});/**
+ * @license
+ * Copyright 2018 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+var r={LINE_RIPPLE_ACTIVE:"mdc-line-ripple--active",LINE_RIPPLE_DEACTIVATING:"mdc-line-ripple--deactivating"}}})});
+//# sourceMappingURL=mdc.lineRipple.min.js.map
\ No newline at end of file
diff --git a/node_modules/@material/line-ripple/foundation.js b/node_modules/@material/line-ripple/foundation.js
new file mode 100644
index 0000000..4f7dc46
--- /dev/null
+++ b/node_modules/@material/line-ripple/foundation.js
@@ -0,0 +1,108 @@
+/**
+ * @license
+ * Copyright 2018 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import MDCFoundation from '@material/base/foundation';
+import MDCLineRippleAdapter from './adapter';
+import {cssClasses} from './constants';
+
+
+/**
+ * @extends {MDCFoundation<!MDCLineRippleAdapter>}
+ * @final
+ */
+class MDCLineRippleFoundation extends MDCFoundation {
+  /** @return enum {string} */
+  static get cssClasses() {
+    return cssClasses;
+  }
+
+  /**
+   * {@see MDCLineRippleAdapter} for typing information on parameters and return
+   * types.
+   * @return {!MDCLineRippleAdapter}
+   */
+  static get defaultAdapter() {
+    return /** @type {!MDCLineRippleAdapter} */ ({
+      addClass: () => {},
+      removeClass: () => {},
+      hasClass: () => {},
+      setStyle: () => {},
+      registerEventHandler: () => {},
+      deregisterEventHandler: () => {},
+    });
+  }
+
+  /**
+   * @param {!MDCLineRippleAdapter=} adapter
+   */
+  constructor(adapter = /** @type {!MDCLineRippleAdapter} */ ({})) {
+    super(Object.assign(MDCLineRippleFoundation.defaultAdapter, adapter));
+
+    /** @private {function(!Event): undefined} */
+    this.transitionEndHandler_ = (evt) => this.handleTransitionEnd(evt);
+  }
+
+  init() {
+    this.adapter_.registerEventHandler('transitionend', this.transitionEndHandler_);
+  }
+
+  destroy() {
+    this.adapter_.deregisterEventHandler('transitionend', this.transitionEndHandler_);
+  }
+
+  /**
+   * Activates the line ripple
+   */
+  activate() {
+    this.adapter_.removeClass(cssClasses.LINE_RIPPLE_DEACTIVATING);
+    this.adapter_.addClass(cssClasses.LINE_RIPPLE_ACTIVE);
+  }
+
+  /**
+   * Sets the center of the ripple animation to the given X coordinate.
+   * @param {number} xCoordinate
+   */
+  setRippleCenter(xCoordinate) {
+    this.adapter_.setStyle('transform-origin', `${xCoordinate}px center`);
+  }
+
+  /**
+   * Deactivates the line ripple
+   */
+  deactivate() {
+    this.adapter_.addClass(cssClasses.LINE_RIPPLE_DEACTIVATING);
+  }
+
+  /**
+   * Handles a transition end event
+   * @param {!Event} evt
+   */
+  handleTransitionEnd(evt) {
+    // Wait for the line ripple to be either transparent or opaque
+    // before emitting the animation end event
+    const isDeactivating = this.adapter_.hasClass(cssClasses.LINE_RIPPLE_DEACTIVATING);
+
+    if (evt.propertyName === 'opacity') {
+      if (isDeactivating) {
+        this.adapter_.removeClass(cssClasses.LINE_RIPPLE_ACTIVE);
+        this.adapter_.removeClass(cssClasses.LINE_RIPPLE_DEACTIVATING);
+      }
+    }
+  }
+}
+
+export default MDCLineRippleFoundation;
diff --git a/node_modules/@material/line-ripple/index.js b/node_modules/@material/line-ripple/index.js
new file mode 100644
index 0000000..4e27697
--- /dev/null
+++ b/node_modules/@material/line-ripple/index.js
@@ -0,0 +1,74 @@
+/**
+ * @license
+ * Copyright 2018 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import MDCComponent from '@material/base/component';
+
+import MDCLineRippleAdapter from './adapter';
+import MDCLineRippleFoundation from './foundation';
+
+/**
+ * @extends {MDCComponent<!MDCLineRippleFoundation>}
+ * @final
+ */
+class MDCLineRipple extends MDCComponent {
+  /**
+   * @param {!Element} root
+   * @return {!MDCLineRipple}
+   */
+  static attachTo(root) {
+    return new MDCLineRipple(root);
+  }
+
+  /**
+   * Activates the line ripple
+   */
+  activate() {
+    this.foundation_.activate();
+  }
+
+  /**
+   * Deactivates the line ripple
+   */
+  deactivate() {
+    this.foundation_.deactivate();
+  }
+
+  /**
+   * Sets the transform origin given a user's click location. The `rippleCenter` is the
+   * x-coordinate of the middle of the ripple.
+   * @param {number} xCoordinate
+   */
+  setRippleCenter(xCoordinate) {
+    this.foundation_.setRippleCenter(xCoordinate);
+  }
+
+  /**
+   * @return {!MDCLineRippleFoundation}
+   */
+  getDefaultFoundation() {
+    return new MDCLineRippleFoundation(/** @type {!MDCLineRippleAdapter} */ (Object.assign({
+      addClass: (className) => this.root_.classList.add(className),
+      removeClass: (className) => this.root_.classList.remove(className),
+      hasClass: (className) => this.root_.classList.contains(className),
+      setStyle: (propertyName, value) => this.root_.style[propertyName] = value,
+      registerEventHandler: (evtType, handler) => this.root_.addEventListener(evtType, handler),
+      deregisterEventHandler: (evtType, handler) => this.root_.removeEventListener(evtType, handler),
+    })));
+  }
+}
+
+export {MDCLineRipple, MDCLineRippleFoundation};
diff --git a/node_modules/@material/line-ripple/mdc-line-ripple.scss b/node_modules/@material/line-ripple/mdc-line-ripple.scss
new file mode 100644
index 0000000..515588f
--- /dev/null
+++ b/node_modules/@material/line-ripple/mdc-line-ripple.scss
@@ -0,0 +1,45 @@
+//
+// Copyright 2018 Google Inc. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+@import "@material/base/mixins";
+@import "@material/theme/mixins";
+@import "./functions";
+@import "./mixins";
+
+// Line Ripple is intended for use by multiple components, but its styles should only be emitted once when bundled
+@include mdc-base-emit-once("mdc-line-ripple") {
+  // postcss-bem-linter: define line-ripple
+  .mdc-line-ripple {
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    width: 100%;
+    height: 2px;
+    transform: scaleX(0);
+    transition: mdc-line-ripple-transition-value(transform), mdc-line-ripple-transition-value(opacity);
+    opacity: 0;
+    z-index: 2;
+  }
+
+  .mdc-line-ripple--active {
+    transform: scaleX(1);
+    opacity: 1;
+  }
+
+  .mdc-line-ripple--deactivating {
+    opacity: 0;
+  }
+}
diff --git a/node_modules/@material/line-ripple/node_modules/@material/theme/README.md b/node_modules/@material/line-ripple/node_modules/@material/theme/README.md
new file mode 100644
index 0000000..f757529
--- /dev/null
+++ b/node_modules/@material/line-ripple/node_modules/@material/theme/README.md
@@ -0,0 +1,181 @@
+<!--docs:
+title: "Theme"
+layout: detail
+section: components
+excerpt: "Color theming for MDC Web components."
+iconId: theme
+path: /catalog/theme/
+-->
+
+# Theme
+
+The Material Design color system can be used to create a color scheme that reflects your brand or style.
+
+## Design & API Documentation
+
+<ul class="icon-list">
+  <li class="icon-list-item icon-list-item--spec">
+    <a href="https://material.io/go/design-theming">Material Design guidelines: Color</a>
+  </li>
+</ul>
+
+## Installation
+
+```
+npm install @material/theme
+```
+
+## Usage
+
+### Color Scheme
+
+You can define the theme color variables before importing any MDC Web components:
+
+```scss
+$mdc-theme-primary: #fcb8ab;
+$mdc-theme-secondary: #feeae6;
+$mdc-theme-on-primary: #442b2d;
+$mdc-theme-on-secondary: #442b2d;
+
+@import "@material/button/mdc-button";
+```
+
+We suggest you follow the Web Content Accessibility Guidelines 2.0 when picking the values for on-primary, on-secondary, etc. These values should be accessible on top of the corresponding value, e.g. primary and secondary.
+
+https://www.w3.org/TR/WCAG20
+
+### Advanced customization
+
+Color scheme will only get you 80% of the way to a well-designed app. Inevitably there will be some components that do not work "out of the box". To fix problems with accessibility and design, we suggest you use our Sass mixins, such as `mdc-button-filled-accessible`. For more information, consult the documentation for each component.
+
+### Non-Sass customization
+
+Only a very limited number of Material Design color customization features are supported for non-Sass clients. They are a set of CSS custom properties, and a set of CSS classes.
+
+#### CSS Custom Properties
+
+**A note about `<TEXT_STYLE>`**, `<TEXT_STYLE>` represents the lowercase name of the text styles listed above, e.g. `hint`.
+
+CSS Custom property | Description
+--- | ---
+`--mdc-theme-primary` | The theme primary color
+`--mdc-theme-secondary` | The theme secondary color
+`--mdc-theme-background` | The theme background color
+`--mdc-theme-surface` | The theme surface color
+`--mdc-theme-on-primary` | Text color on top of a primary background
+`--mdc-theme-on-secondary` | Text color on top of a secondary background
+`--mdc-theme-on-surface` | Text color on top of a surface background
+`--mdc-theme-text-<TEXT_STYLE>-on-light` | Text color for TEXT_STYLE on top of light background
+`--mdc-theme-text-<TEXT_STYLE>-on-dark` | Text color for TEXT_STYLE on top of dark background
+
+#### CSS Classes
+
+> **A note about `<TEXT_STYLE>`**, `<TEXT_STYLE>` represents the lowercase name of the text styles listed above, e.g. `hint`.
+
+CSS Class | Description
+--- | ---
+`mdc-theme--primary` | Sets the text color to the theme primary color
+`mdc-theme--secondary` | Sets the text color to the theme secondary color
+`mdc-theme--background` | Sets the background color to the theme background color
+`mdc-theme--surface` | Sets the surface color to the theme surface color
+`mdc-theme--on-primary` | Sets the text color to the theme on-primary color
+`mdc-theme--on-secondary` | Sets the text color to the theme on-secondary color
+`mdc-theme--on-surface` | Sets the text color to the theme on-surface color
+`mdc-theme--primary-bg` | Sets the background color to the theme primary color
+`mdc-theme--secondary-bg` | Sets the background color to the theme secondary color
+`mdc-theme--text-<TEXT_STYLE>-on-light` | Sets text to a suitable color for TEXT_STYLE on top of light background
+`mdc-theme--text-<TEXT_STYLE>-on-dark` | Sets text to a suitable color for TEXT_STYLE on top of dark background
+
+### Sass Mixins, Variables, and Functions
+
+Mixin | Description
+--- | ---
+`mdc-theme-prop($property, $style, $important, $edgeOptOut)` | Applies a theme color or a custom color to a CSS property, optionally with `!important`. If `$edgeOptOut` is `true` and a theme color is passed, the style will be wrapped in a `@supports` clause to exclude the style in Edge to avoid issues with its buggy CSS variable support.
+
+#### `mdc-theme-prop` Properties
+
+The properties below can be used as the `$style` argument for the `mdc-theme-prop` mixin. Literal color values (e.g., `rgba(0, 0, 0, .75)`) may also be used instead.
+
+**A note about `<TEXT_STYLE>`**, `<TEXT_STYLE>` represents the lowercase name of the text styles listed above, e.g. `hint`.
+
+Property Name | Description
+--- | ---
+`primary` | The theme primary color
+`secondary` | The theme secondary color
+`background` | The theme background color
+`surface` | The theme surface color
+`text-<TEXT_STYLE>-on-light` | TEXT_STYLE on top of a light background
+`text-<TEXT_STYLE>-on-dark` | TEXT_STYLE on top of a dark background
+`on-primary` | A text/iconography color that is usable on top of primary color
+`on-secondary` | A text/iconography color that is usable on top of secondary color
+`on-surface` | A text/iconography color that is usable on top of surface color
+
+
+#### `mdc-theme-luminance($color)`
+
+Calculates the luminance value (0 - 1) of a given color.
+
+```scss
+@debug mdc-theme-luminance(#9c27b0); // 0.11654
+```
+
+#### `mdc-theme-contrast($back, $front)`
+
+Calculates the contrast ratio between two colors.
+
+```scss
+@debug mdc-theme-contrast(#9c27b0, #000); // 3.33071
+```
+
+#### `mdc-theme-tone($color)`
+
+Determines whether the given color is "light" or "dark".
+
+If the input color is a string literal equal to `"light"` or `"dark"`, it will be returned verbatim.
+
+```scss
+@debug mdc-theme-tone(#9c27b0); // dark
+@debug mdc-theme-tone(light);   // light
+```
+
+#### `mdc-theme-contrast-tone($color)`
+
+Determines whether to use light or dark text on top of a given color.
+
+```scss
+@debug mdc-theme-contrast-tone(#9c27b0); // light
+```
+
+#### `mdc-theme-prop-value($style)`
+
+If `$style` is a color (a literal color value, `currentColor`, or a CSS custom property), it is returned verbatim.
+Otherwise, `$style` is treated as a theme property name, and the corresponding value from `$mdc-theme-property-values`
+is returned. If this also fails, an error is thrown.
+
+This is mainly useful in situations where `mdc-theme-prop` cannot be used directly (e.g., `box-shadow`).
+
+Unlike the `mdc-theme-prop` mixin, this function does _not_ support CSS custom properties.
+It only returns the raw color value of the specified theme property.
+
+> NOTE: This function is defined in `_variables.scss` instead of `_functions.scss` to avoid circular imports.
+
+```scss
+@debug mdc-theme-prop-value(primary); // #3f51b5
+@debug mdc-theme-prop-value(blue);    // blue
+```
+
+#### `mdc-theme-accessible-ink-color($fill-color, $text-style: primary)`
+
+Returns an accessible ink color that has sufficient contrast against the given fill color.
+
+Params:
+
+- `$fill-color`: Supports the same values as `mdc-theme-prop-value`
+- `$text-style`: Value must be one of `primary`, `secondary`, `hint`, `disabled`, `icon` (see `$mdc-theme-text-colors`)
+
+> NOTE: This function is defined in `_variables.scss` instead of `_functions.scss` to avoid circular imports.
+
+```scss
+@debug mdc-theme-accessible-ink-color(secondary); // rgba(0, 0, 0, .87) (text-primary-on-light)
+@debug mdc-theme-accessible-ink-color(blue);      // white              (text-primary-on-dark)
+```
diff --git a/node_modules/@material/line-ripple/node_modules/@material/theme/_color-palette.scss b/node_modules/@material/line-ripple/node_modules/@material/theme/_color-palette.scss
new file mode 100644
index 0000000..ef5122b
--- /dev/null
+++ b/node_modules/@material/line-ripple/node_modules/@material/theme/_color-palette.scss
@@ -0,0 +1,290 @@
+//
+// Copyright 2017 Google Inc. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+// stylelint-disable scss/dollar-variable-pattern, color-hex-length
+
+$material-color-red-50: #ffebee;
+$material-color-red-100: #ffcdd2;
+$material-color-red-200: #ef9a9a;
+$material-color-red-300: #e57373;
+$material-color-red-400: #ef5350;
+$material-color-red-500: #f44336;
+$material-color-red-600: #e53935;
+$material-color-red-700: #d32f2f;
+$material-color-red-800: #c62828;
+$material-color-red-900: #b71c1c;
+$material-color-red-a100: #ff8a80;
+$material-color-red-a200: #ff5252;
+$material-color-red-a400: #ff1744;
+$material-color-red-a700: #d50000;
+
+$material-color-pink-50: #fce4ec;
+$material-color-pink-100: #f8bbd0;
+$material-color-pink-200: #f48fb1;
+$material-color-pink-300: #f06292;
+$material-color-pink-400: #ec407a;
+$material-color-pink-500: #e91e63;
+$material-color-pink-600: #d81b60;
+$material-color-pink-700: #c2185b;
+$material-color-pink-800: #ad1457;
+$material-color-pink-900: #880e4f;
+$material-color-pink-a100: #ff80ab;
+$material-color-pink-a200: #ff4081;
+$material-color-pink-a400: #f50057;
+$material-color-pink-a700: #c51162;
+
+$material-color-purple-50: #f3e5f5;
+$material-color-purple-100: #e1bee7;
+$material-color-purple-200: #ce93d8;
+$material-color-purple-300: #ba68c8;
+$material-color-purple-400: #ab47bc;
+$material-color-purple-500: #9c27b0;
+$material-color-purple-600: #8e24aa;
+$material-color-purple-700: #7b1fa2;
+$material-color-purple-800: #6a1b9a;
+$material-color-purple-900: #4a148c;
+$material-color-purple-a100: #ea80fc;
+$material-color-purple-a200: #e040fb;
+$material-color-purple-a400: #d500f9;
+$material-color-purple-a700: #aa00ff;
+
+$material-color-deep-purple-50: #ede7f6;
+$material-color-deep-purple-100: #d1c4e9;
+$material-color-deep-purple-200: #b39ddb;
+$material-color-deep-purple-300: #9575cd;
+$material-color-deep-purple-400: #7e57c2;
+$material-color-deep-purple-500: #673ab7;
+$material-color-deep-purple-600: #5e35b1;
+$material-color-deep-purple-700: #512da8;
+$material-color-deep-purple-800: #4527a0;
+$material-color-deep-purple-900: #311b92;
+$material-color-deep-purple-a100: #b388ff;
+$material-color-deep-purple-a200: #7c4dff;
+$material-color-deep-purple-a400: #651fff;
+$material-color-deep-purple-a700: #6200ea;
+
+$material-color-indigo-50: #e8eaf6;
+$material-color-indigo-100: #c5cae9;
+$material-color-indigo-200: #9fa8da;
+$material-color-indigo-300: #7986cb;
+$material-color-indigo-400: #5c6bc0;
+$material-color-indigo-500: #3f51b5;
+$material-color-indigo-600: #3949ab;
+$material-color-indigo-700: #303f9f;
+$material-color-indigo-800: #283593;
+$material-color-indigo-900: #1a237e;
+$material-color-indigo-a100: #8c9eff;
+$material-color-indigo-a200: #536dfe;
+$material-color-indigo-a400: #3d5afe;
+$material-color-indigo-a700: #304ffe;
+
+$material-color-blue-50: #e3f2fd;
+$material-color-blue-100: #bbdefb;
+$material-color-blue-200: #90caf9;
+$material-color-blue-300: #64b5f6;
+$material-color-blue-400: #42a5f5;
+$material-color-blue-500: #2196f3;
+$material-color-blue-600: #1e88e5;
+$material-color-blue-700: #1976d2;
+$material-color-blue-800: #1565c0;
+$material-color-blue-900: #0d47a1;
+$material-color-blue-a100: #82b1ff;
+$material-color-blue-a200: #448aff;
+$material-color-blue-a400: #2979ff;
+$material-color-blue-a700: #2962ff;
+
+$material-color-light-blue-50: #e1f5fe;
+$material-color-light-blue-100: #b3e5fc;
+$material-color-light-blue-200: #81d4fa;
+$material-color-light-blue-300: #4fc3f7;
+$material-color-light-blue-400: #29b6f6;
+$material-color-light-blue-500: #03a9f4;
+$material-color-light-blue-600: #039be5;
+$material-color-light-blue-700: #0288d1;
+$material-color-light-blue-800: #0277bd;
+$material-color-light-blue-900: #01579b;
+$material-color-light-blue-a100: #80d8ff;
+$material-color-light-blue-a200: #40c4ff;
+$material-color-light-blue-a400: #00b0ff;
+$material-color-light-blue-a700: #0091ea;
+
+$material-color-cyan-50: #e0f7fa;
+$material-color-cyan-100: #b2ebf2;
+$material-color-cyan-200: #80deea;
+$material-color-cyan-300: #4dd0e1;
+$material-color-cyan-400: #26c6da;
+$material-color-cyan-500: #00bcd4;
+$material-color-cyan-600: #00acc1;
+$material-color-cyan-700: #0097a7;
+$material-color-cyan-800: #00838f;
+$material-color-cyan-900: #006064;
+$material-color-cyan-a100: #84ffff;
+$material-color-cyan-a200: #18ffff;
+$material-color-cyan-a400: #00e5ff;
+$material-color-cyan-a700: #00b8d4;
+
+$material-color-teal-50: #e0f2f1;
+$material-color-teal-100: #b2dfdb;
+$material-color-teal-200: #80cbc4;
+$material-color-teal-300: #4db6ac;
+$material-color-teal-400: #26a69a;
+$material-color-teal-500: #009688;
+$material-color-teal-600: #00897b;
+$material-color-teal-700: #00796b;
+$material-color-teal-800: #00695c;
+$material-color-teal-900: #004d40;
+$material-color-teal-a100: #a7ffeb;
+$material-color-teal-a200: #64ffda;
+$material-color-teal-a400: #1de9b6;
+$material-color-teal-a700: #00bfa5;
+
+$material-color-green-50: #e8f5e9;
+$material-color-green-100: #c8e6c9;
+$material-color-green-200: #a5d6a7;
+$material-color-green-300: #81c784;
+$material-color-green-400: #66bb6a;
+$material-color-green-500: #4caf50;
+$material-color-green-600: #43a047;
+$material-color-green-700: #388e3c;
+$material-color-green-800: #2e7d32;
+$material-color-green-900: #1b5e20;
+$material-color-green-a100: #b9f6ca;
+$material-color-green-a200: #69f0ae;
+$material-color-green-a400: #00e676;
+$material-color-green-a700: #00c853;
+
+$material-color-light-green-50: #f1f8e9;
+$material-color-light-green-100: #dcedc8;
+$material-color-light-green-200: #c5e1a5;
+$material-color-light-green-300: #aed581;
+$material-color-light-green-400: #9ccc65;
+$material-color-light-green-500: #8bc34a;
+$material-color-light-green-600: #7cb342;
+$material-color-light-green-700: #689f38;
+$material-color-light-green-800: #558b2f;
+$material-color-light-green-900: #33691e;
+$material-color-light-green-a100: #ccff90;
+$material-color-light-green-a200: #b2ff59;
+$material-color-light-green-a400: #76ff03;
+$material-color-light-green-a700: #64dd17;
+
+$material-color-lime-50: #f9fbe7;
+$material-color-lime-100: #f0f4c3;
+$material-color-lime-200: #e6ee9c;
+$material-color-lime-300: #dce775;
+$material-color-lime-400: #d4e157;
+$material-color-lime-500: #cddc39;
+$material-color-lime-600: #c0ca33;
+$material-color-lime-700: #afb42b;
+$material-color-lime-800: #9e9d24;
+$material-color-lime-900: #827717;
+$material-color-lime-a100: #f4ff81;
+$material-color-lime-a200: #eeff41;
+$material-color-lime-a400: #c6ff00;
+$material-color-lime-a700: #aeea00;
+
+$material-color-yellow-50: #fffde7;
+$material-color-yellow-100: #fff9c4;
+$material-color-yellow-200: #fff59d;
+$material-color-yellow-300: #fff176;
+$material-color-yellow-400: #ffee58;
+$material-color-yellow-500: #ffeb3b;
+$material-color-yellow-600: #fdd835;
+$material-color-yellow-700: #fbc02d;
+$material-color-yellow-800: #f9a825;
+$material-color-yellow-900: #f57f17;
+$material-color-yellow-a100: #ffff8d;
+$material-color-yellow-a200: #ffff00;
+$material-color-yellow-a400: #ffea00;
+$material-color-yellow-a700: #ffd600;
+
+$material-color-amber-50: #fff8e1;
+$material-color-amber-100: #ffecb3;
+$material-color-amber-200: #ffe082;
+$material-color-amber-300: #ffd54f;
+$material-color-amber-400: #ffca28;
+$material-color-amber-500: #ffc107;
+$material-color-amber-600: #ffb300;
+$material-color-amber-700: #ffa000;
+$material-color-amber-800: #ff8f00;
+$material-color-amber-900: #ff6f00;
+$material-color-amber-a100: #ffe57f;
+$material-color-amber-a200: #ffd740;
+$material-color-amber-a400: #ffc400;
+$material-color-amber-a700: #ffab00;
+
+$material-color-orange-50: #fff3e0;
+$material-color-orange-100: #ffe0b2;
+$material-color-orange-200: #ffcc80;
+$material-color-orange-300: #ffb74d;
+$material-color-orange-400: #ffa726;
+$material-color-orange-500: #ff9800;
+$material-color-orange-600: #fb8c00;
+$material-color-orange-700: #f57c00;
+$material-color-orange-800: #ef6c00;
+$material-color-orange-900: #e65100;
+$material-color-orange-a100: #ffd180;
+$material-color-orange-a200: #ffab40;
+$material-color-orange-a400: #ff9100;
+$material-color-orange-a700: #ff6d00;
+
+$material-color-deep-orange-50: #fbe9e7;
+$material-color-deep-orange-100: #ffccbc;
+$material-color-deep-orange-200: #ffab91;
+$material-color-deep-orange-300: #ff8a65;
+$material-color-deep-orange-400: #ff7043;
+$material-color-deep-orange-500: #ff5722;
+$material-color-deep-orange-600: #f4511e;
+$material-color-deep-orange-700: #e64a19;
+$material-color-deep-orange-800: #d84315;
+$material-color-deep-orange-900: #bf360c;
+$material-color-deep-orange-a100: #ff9e80;
+$material-color-deep-orange-a200: #ff6e40;
+$material-color-deep-orange-a400: #ff3d00;
+$material-color-deep-orange-a700: #dd2c00;
+
+$material-color-brown-50: #efebe9;
+$material-color-brown-100: #d7ccc8;
+$material-color-brown-200: #bcaaa4;
+$material-color-brown-300: #a1887f;
+$material-color-brown-400: #8d6e63;
+$material-color-brown-500: #795548;
+$material-color-brown-600: #6d4c41;
+$material-color-brown-700: #5d4037;
+$material-color-brown-800: #4e342e;
+$material-color-brown-900: #3e2723;
+
+$material-color-grey-50: #fafafa;
+$material-color-grey-100: #f5f5f5;
+$material-color-grey-200: #eeeeee;
+$material-color-grey-300: #e0e0e0;
+$material-color-grey-400: #bdbdbd;
+$material-color-grey-500: #9e9e9e;
+$material-color-grey-600: #757575;
+$material-color-grey-700: #616161;
+$material-color-grey-800: #424242;
+$material-color-grey-900: #212121;
+
+$material-color-blue-grey-50: #eceff1;
+$material-color-blue-grey-100: #cfd8dc;
+$material-color-blue-grey-200: #b0bec5;
+$material-color-blue-grey-300: #90a4ae;
+$material-color-blue-grey-400: #78909c;
+$material-color-blue-grey-500: #607d8b;
+$material-color-blue-grey-600: #546e7a;
+$material-color-blue-grey-700: #455a64;
+$material-color-blue-grey-800: #37474f;
+$material-color-blue-grey-900: #263238;
diff --git a/node_modules/@material/line-ripple/node_modules/@material/theme/_constants.scss b/node_modules/@material/line-ripple/node_modules/@material/theme/_constants.scss
new file mode 100644
index 0000000..baa150d
--- /dev/null
+++ b/node_modules/@material/line-ripple/node_modules/@material/theme/_constants.scss
@@ -0,0 +1,283 @@
+//
+// Copyright 2017 Google Inc. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+// Precomputed linear color channel values, for use in contrast calculations.
+// See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+//
+// Algorithm, for c in 0 to 255:
+// f(c) {
+//   c = c / 255;
+//   return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+// }
+//
+// This lookup table is needed since there is no `pow` in SASS.
+$mdc-theme-linear-channel-values:
+  0
+  .0003035269835488375
+  .000607053967097675
+  .0009105809506465125
+  .00121410793419535
+  .0015176349177441874
+  .001821161901293025
+  .0021246888848418626
+  .0024282158683907
+  .0027317428519395373
+  .003035269835488375
+  .003346535763899161
+  .003676507324047436
+  .004024717018496307
+  .004391442037410293
+  .004776953480693729
+  .005181516702338386
+  .005605391624202723
+  .006048833022857054
+  .006512090792594475
+  .006995410187265387
+  .007499032043226175
+  .008023192985384994
+  .008568125618069307
+  .009134058702220787
+  .00972121732023785
+  .010329823029626936
+  .010960094006488246
+  .011612245179743885
+  .012286488356915872
+  .012983032342173012
+  .013702083047289686
+  .014443843596092545
+  .01520851442291271
+  .01599629336550963
+  .016807375752887384
+  .017641954488384078
+  .018500220128379697
+  .019382360956935723
+  .0202885630566524
+  .021219010376003555
+  .022173884793387385
+  .02315336617811041
+  .024157632448504756
+  .02518685962736163
+  .026241221894849898
+  .027320891639074894
+  .028426039504420793
+  .0295568344378088
+  .030713443732993635
+  .03189603307301153
+  .033104766570885055
+  .03433980680868217
+  .03560131487502034
+  .03688945040110004
+  .0382043715953465
+  .03954623527673284
+  .04091519690685319
+  .042311410620809675
+  .043735029256973465
+  .04518620438567554
+  .046665086336880095
+  .04817182422688942
+  .04970656598412723
+  .05126945837404324
+  .052860647023180246
+  .05448027644244237
+  .05612849004960009
+  .05780543019106723
+  .0595112381629812
+  .06124605423161761
+  .06301001765316767
+  .06480326669290577
+  .06662593864377289
+  .06847816984440017
+  .07036009569659588
+  .07227185068231748
+  .07421356838014963
+  .07618538148130785
+  .07818742180518633
+  .08021982031446832
+  .0822827071298148
+  .08437621154414882
+  .08650046203654976
+  .08865558628577294
+  .09084171118340768
+  .09305896284668745
+  .0953074666309647
+  .09758734714186246
+  .09989872824711389
+  .10224173308810132
+  .10461648409110419
+  .10702310297826761
+  .10946171077829933
+  .1119324278369056
+  .11443537382697373
+  .11697066775851084
+  .11953842798834562
+  .12213877222960187
+  .12477181756095049
+  .12743768043564743
+  .1301364766903643
+  .13286832155381798
+  .13563332965520566
+  .13843161503245183
+  .14126329114027164
+  .14412847085805777
+  .14702726649759498
+  .14995978981060856
+  .15292615199615017
+  .1559264637078274
+  .1589608350608804
+  .162029375639111
+  .1651321945016676
+  .16826940018969075
+  .1714411007328226
+  .17464740365558504
+  .17788841598362912
+  .18116424424986022
+  .184474994500441
+  .18782077230067787
+  .19120168274079138
+  .1946178304415758
+  .19806931955994886
+  .20155625379439707
+  .20507873639031693
+  .20863687014525575
+  .21223075741405523
+  .21586050011389926
+  .2195261997292692
+  .2232279573168085
+  .22696587351009836
+  .23074004852434915
+  .23455058216100522
+  .238397573812271
+  .24228112246555486
+  .24620132670783548
+  .25015828472995344
+  .25415209433082675
+  .2581828529215958
+  .26225065752969623
+  .26635560480286247
+  .2704977910130658
+  .27467731206038465
+  .2788942634768104
+  .2831487404299921
+  .2874408377269175
+  .29177064981753587
+  .2961382707983211
+  .3005437944157765
+  .3049873140698863
+  .30946892281750854
+  .31398871337571754
+  .31854677812509186
+  .32314320911295075
+  .3277780980565422
+  .33245153634617935
+  .33716361504833037
+  .3419144249086609
+  .3467040563550296
+  .35153259950043936
+  .3564001441459435
+  .3613067797835095
+  .3662525955988395
+  .3712376804741491
+  .3762621229909065
+  .38132601143253014
+  .386429433787049
+  .39157247774972326
+  .39675523072562685
+  .4019777798321958
+  .4072402119017367
+  .41254261348390375
+  .4178850708481375
+  .4232676699860717
+  .4286904966139066
+  .43415363617474895
+  .4396571738409188
+  .44520119451622786
+  .45078578283822346
+  .45641102318040466
+  .4620769996544071
+  .467783796112159
+  .47353149614800955
+  .4793201831008268
+  .4851499400560704
+  .4910208498478356
+  .4969329950608704
+  .5028864580325687
+  .5088813208549338
+  .5149176653765214
+  .5209955732043543
+  .5271151257058131
+  .5332764040105052
+  .5394794890121072
+  .5457244613701866
+  .5520114015120001
+  .5583403896342679
+  .5647115057049292
+  .5711248294648731
+  .5775804404296506
+  .5840784178911641
+  .5906188409193369
+  .5972017883637634
+  .6038273388553378
+  .6104955708078648
+  .6172065624196511
+  .6239603916750761
+  .6307571363461468
+  .6375968739940326
+  .6444796819705821
+  .6514056374198242
+  .6583748172794485
+  .665387298282272
+  .6724431569576875
+  .6795424696330938
+  .6866853124353135
+  .6938717612919899
+  .7011018919329731
+  .7083757798916868
+  .7156935005064807
+  .7230551289219693
+  .7304607400903537
+  .7379104087727308
+  .7454042095403874
+  .7529422167760779
+  .7605245046752924
+  .768151147247507
+  .7758222183174236
+  .7835377915261935
+  .7912979403326302
+  .799102738014409
+  .8069522576692516
+  .8148465722161012
+  .8227857543962835
+  .8307698767746546
+  .83879901174074
+  .846873231509858
+  .8549926081242338
+  .8631572134541023
+  .8713671191987972
+  .8796223968878317
+  .8879231178819663
+  .8962693533742664
+  .9046611743911496
+  .9130986517934192
+  .9215818562772946
+  .9301108583754237
+  .938685728457888
+  .9473065367331999
+  .9559733532492861
+  .9646862478944651
+  .9734452903984125
+  .9822505503331171
+  .9911020971138298
+  1;
diff --git a/node_modules/@material/line-ripple/node_modules/@material/theme/_functions.scss b/node_modules/@material/line-ripple/node_modules/@material/theme/_functions.scss
new file mode 100644
index 0000000..acf2ff7
--- /dev/null
+++ b/node_modules/@material/line-ripple/node_modules/@material/theme/_functions.scss
@@ -0,0 +1,60 @@
+//
+// Copyright 2017 Google Inc. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+@import "./constants";
+
+// Calculate the luminance for a color.
+// See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+@function mdc-theme-luminance($color) {
+  $red: nth($mdc-theme-linear-channel-values, red($color) + 1);
+  $green: nth($mdc-theme-linear-channel-values, green($color) + 1);
+  $blue: nth($mdc-theme-linear-channel-values, blue($color) + 1);
+
+  @return .2126 * $red + .7152 * $green + .0722 * $blue;
+}
+
+// Calculate the contrast ratio between two colors.
+// See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+@function mdc-theme-contrast($back, $front) {
+  $backLum: mdc-theme-luminance($back) + .05;
+  $foreLum: mdc-theme-luminance($front) + .05;
+
+  @return max($backLum, $foreLum) / min($backLum, $foreLum);
+}
+
+// Determine whether the color is "light" or "dark".
+@function mdc-theme-tone($color) {
+  @if $color == "dark" or $color == "light" {
+    @return $color;
+  }
+
+  $minimumContrast: 3.1;
+
+  $lightContrast: mdc-theme-contrast($color, white);
+  $darkContrast: mdc-theme-contrast($color, rgba(black, .87));
+
+  @if ($lightContrast < $minimumContrast) and ($darkContrast > $lightContrast) {
+    @return "light";
+  } @else {
+    @return "dark";
+  }
+}
+
+// Determine whether to use dark or light text on top of given color to meet accessibility standards for contrast.
+// Returns "dark" if the given color is light and "light" if the given color is dark.
+@function mdc-theme-contrast-tone($color) {
+  @return if(mdc-theme-tone($color) == "dark", "light", "dark");
+}
diff --git a/node_modules/@material/line-ripple/node_modules/@material/theme/_mixins.scss b/node_modules/@material/line-ripple/node_modules/@material/theme/_mixins.scss
new file mode 100644
index 0000000..9510df2
--- /dev/null
+++ b/node_modules/@material/line-ripple/node_modules/@material/theme/_mixins.scss
@@ -0,0 +1,80 @@
+//
+// Copyright 2017 Google Inc. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+@import "./variables";
+
+// Applies the correct theme color style to the specified property.
+// $property is typically color or background-color, but can be any CSS property that accepts color values.
+// $style should be one of the map keys in $mdc-theme-property-values (_variables.scss), or a color value.
+// $edgeOptOut controls whether to feature-detect around Edge to avoid emitting CSS variables for it,
+// intended for use in cases where interactions with pseudo-element styles cause problems due to Edge bugs.
+@mixin mdc-theme-prop($property, $style, $important: false, $edgeOptOut: false) {
+  @if mdc-theme-is-valid-theme-prop-value_($style) {
+    @if $important {
+      #{$property}: $style !important;
+    } @else {
+      #{$property}: $style;
+    }
+  } @else {
+    @if not map-has-key($mdc-theme-property-values, $style) {
+      @error "Invalid style: '#{$style}'. Choose one of: #{map-keys($mdc-theme-property-values)}";
+    }
+
+    $value: map-get($mdc-theme-property-values, $style);
+
+    @if $important {
+      #{$property}: $value !important;
+
+      @if $edgeOptOut {
+        // stylelint-disable max-nesting-depth
+        @at-root {
+          @supports not (-ms-ime-align:auto) {
+            // stylelint-disable scss/selector-no-redundant-nesting-selector
+            & {
+              /* @alternate */
+              #{$property}: var(--mdc-theme-#{$style}, $value) !important;
+            }
+            // stylelint-enable scss/selector-no-redundant-nesting-selector
+          }
+        }
+        // stylelint-enable max-nesting-depth
+      } @else {
+        /* @alternate */
+        #{$property}: var(--mdc-theme-#{$style}, $value) !important;
+      }
+    } @else {
+      #{$property}: $value;
+
+      @if $edgeOptOut {
+        // stylelint-disable max-nesting-depth
+        @at-root {
+          @supports not (-ms-ime-align:auto) {
+            // stylelint-disable scss/selector-no-redundant-nesting-selector
+            & {
+              /* @alternate */
+              #{$property}: var(--mdc-theme-#{$style}, $value);
+            }
+            // stylelint-enable scss/selector-no-redundant-nesting-selector
+          }
+        }
+        // stylelint-enable max-nesting-depth
+      } @else {
+        /* @alternate */
+        #{$property}: var(--mdc-theme-#{$style}, $value);
+      }
+    }
+  }
+}
diff --git a/node_modules/@material/line-ripple/node_modules/@material/theme/_variables.scss b/node_modules/@material/line-ripple/node_modules/@material/theme/_variables.scss
new file mode 100644
index 0000000..8c962f3
--- /dev/null
+++ b/node_modules/@material/line-ripple/node_modules/@material/theme/_variables.scss
@@ -0,0 +1,140 @@
+//
+// Copyright 2017 Google Inc. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+@import "./functions";
+
+//
+// Main theme colors for your brand.
+//
+// If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+//
+
+$mdc-theme-primary: #6200ee !default; // baseline purple, 500 tone
+$mdc-theme-on-primary: if(mdc-theme-contrast-tone($mdc-theme-primary) == "dark", #000, #fff) !default;
+
+// The $mdc-theme-accent variable is DEPRECATED - it exists purely for backward compatibility.
+// The $mdc-theme-secondary* variables should be used for all new projects.
+$mdc-theme-accent: #018786 !default; // baseline teal, 600 tone
+$mdc-theme-secondary: $mdc-theme-accent !default;
+$mdc-theme-on-secondary: if(mdc-theme-contrast-tone($mdc-theme-secondary) == "dark", #000, #fff) !default;
+$mdc-theme-background: #fff !default; // White
+
+$mdc-theme-surface: #fff !default;
+$mdc-theme-on-surface: if(mdc-theme-contrast-tone($mdc-theme-surface) == "dark", #000, #fff) !default;
+
+//
+// Text colors according to light vs dark and text type.
+//
+
+$mdc-theme-text-colors: (
+  dark: (
+    primary: rgba(black, .87),
+    secondary: rgba(black, .54),
+    hint: rgba(black, .38),
+    disabled: rgba(black, .38),
+    icon: rgba(black, .38)
+  ),
+  light: (
+    primary: white,
+    secondary: rgba(white, .7),
+    hint: rgba(white, .5),
+    disabled: rgba(white, .5),
+    icon: rgba(white, .5)
+  )
+) !default;
+
+@function mdc-theme-ink-color-for-fill_($text-style, $fill-color) {
+  $contrast-tone: mdc-theme-contrast-tone($fill-color);
+
+  @return map-get(map-get($mdc-theme-text-colors, $contrast-tone), $text-style);
+}
+
+//
+// Primary text colors for each of the theme colors.
+//
+
+$mdc-theme-property-values: (
+  // Primary
+  primary: $mdc-theme-primary,
+  // Secondary
+  secondary: $mdc-theme-secondary,
+  // Background
+  background: $mdc-theme-background,
+  // Surface
+  surface: $mdc-theme-surface,
+  on-primary: $mdc-theme-on-primary,
+  on-secondary: $mdc-theme-on-secondary,
+  on-surface: $mdc-theme-on-surface,
+  // Text-primary on "background" background
+  text-primary-on-background: mdc-theme-ink-color-for-fill_(primary, $mdc-theme-background),
+  text-secondary-on-background: mdc-theme-ink-color-for-fill_(secondary, $mdc-theme-background),
+  text-hint-on-background: mdc-theme-ink-color-for-fill_(hint, $mdc-theme-background),
+  text-disabled-on-background: mdc-theme-ink-color-for-fill_(disabled, $mdc-theme-background),
+  text-icon-on-background: mdc-theme-ink-color-for-fill_(icon, $mdc-theme-background),
+  // Text-primary on "light" background
+  text-primary-on-light: mdc-theme-ink-color-for-fill_(primary, light),
+  text-secondary-on-light: mdc-theme-ink-color-for-fill_(secondary, light),
+  text-hint-on-light: mdc-theme-ink-color-for-fill_(hint, light),
+  text-disabled-on-light: mdc-theme-ink-color-for-fill_(disabled, light),
+  text-icon-on-light: mdc-theme-ink-color-for-fill_(icon, light),
+  // Text-primary on "dark" background
+  text-primary-on-dark: mdc-theme-ink-color-for-fill_(primary, dark),
+  text-secondary-on-dark: mdc-theme-ink-color-for-fill_(secondary, dark),
+  text-hint-on-dark: mdc-theme-ink-color-for-fill_(hint, dark),
+  text-disabled-on-dark: mdc-theme-ink-color-for-fill_(disabled, dark),
+  text-icon-on-dark: mdc-theme-ink-color-for-fill_(icon, dark)
+);
+
+// If `$style` is a color (a literal color value, `currentColor`, or a CSS custom property), it is returned verbatim.
+// Otherwise, `$style` is treated as a theme property name, and the corresponding value from
+// `$mdc-theme-property-values` is returned. If this also fails, an error is thrown.
+//
+// This is mainly useful in situations where `mdc-theme-prop` cannot be used directly (e.g., `box-shadow`).
+//
+// Examples:
+//
+// 1. mdc-theme-prop-value(primary) => "#6200ee"
+// 2. mdc-theme-prop-value(blue)    => "blue"
+//
+// NOTE: This function must be defined in _variables.scss instead of _functions.scss to avoid circular imports.
+@function mdc-theme-prop-value($style) {
+  @if mdc-theme-is-valid-theme-prop-value_($style) {
+    @return $style;
+  }
+
+  @if not map-has-key($mdc-theme-property-values, $style) {
+    @error "Invalid theme property: '#{$style}'. Choose one of: #{map-keys($mdc-theme-property-values)}";
+  }
+
+  @return map-get($mdc-theme-property-values, $style);
+}
+
+// NOTE: This function must be defined in _variables.scss instead of _functions.scss to avoid circular imports.
+@function mdc-theme-accessible-ink-color($fill-color, $text-style: primary) {
+  $fill-color-value: mdc-theme-prop-value($fill-color);
+  $color-map-for-tone: map-get($mdc-theme-text-colors, mdc-theme-contrast-tone($fill-color-value));
+
+  @if not map-has-key($color-map-for-tone, $text-style) {
+    @error "Invalid $text-style: '#{$text-style}'. Choose one of: #{map-keys($color-map-for-tone)}";
+  }
+
+  @return map-get($color-map-for-tone, $text-style);
+}
+
+// NOTE: This function is depended upon by mdc-theme-prop-value (above) and thus must be defined in this file.
+@function mdc-theme-is-valid-theme-prop-value_($style) {
+  @return type-of($style) == "color" or $style == "currentColor" or str_slice($style, 1, 4) == "var(";
+}
diff --git a/node_modules/@material/line-ripple/node_modules/@material/theme/dist/mdc.theme.css b/node_modules/@material/line-ripple/node_modules/@material/theme/dist/mdc.theme.css
new file mode 100644
index 0000000..9d4696f
--- /dev/null
+++ b/node_modules/@material/line-ripple/node_modules/@material/theme/dist/mdc.theme.css
@@ -0,0 +1,150 @@
+/*!
+ Material Components for the Web
+ Copyright (c) 2018 Google Inc.
+ License: Apache-2.0
+*/
+:root {
+  --mdc-theme-primary: #6200ee;
+  --mdc-theme-secondary: #018786;
+  --mdc-theme-background: #fff;
+  --mdc-theme-surface: #fff;
+  --mdc-theme-on-primary: #fff;
+  --mdc-theme-on-secondary: #fff;
+  --mdc-theme-on-surface: #000;
+  --mdc-theme-text-primary-on-background: rgba(0, 0, 0, 0.87);
+  --mdc-theme-text-secondary-on-background: rgba(0, 0, 0, 0.54);
+  --mdc-theme-text-hint-on-background: rgba(0, 0, 0, 0.38);
+  --mdc-theme-text-disabled-on-background: rgba(0, 0, 0, 0.38);
+  --mdc-theme-text-icon-on-background: rgba(0, 0, 0, 0.38);
+  --mdc-theme-text-primary-on-light: rgba(0, 0, 0, 0.87);
+  --mdc-theme-text-secondary-on-light: rgba(0, 0, 0, 0.54);
+  --mdc-theme-text-hint-on-light: rgba(0, 0, 0, 0.38);
+  --mdc-theme-text-disabled-on-light: rgba(0, 0, 0, 0.38);
+  --mdc-theme-text-icon-on-light: rgba(0, 0, 0, 0.38);
+  --mdc-theme-text-primary-on-dark: white;
+  --mdc-theme-text-secondary-on-dark: rgba(255, 255, 255, 0.7);
+  --mdc-theme-text-hint-on-dark: rgba(255, 255, 255, 0.5);
+  --mdc-theme-text-disabled-on-dark: rgba(255, 255, 255, 0.5);
+  --mdc-theme-text-icon-on-dark: rgba(255, 255, 255, 0.5); }
+
+.mdc-theme--primary {
+  color: #6200ee !important;
+  /* @alternate */
+  color: var(--mdc-theme-primary, #6200ee) !important; }
+
+.mdc-theme--secondary {
+  color: #018786 !important;
+  /* @alternate */
+  color: var(--mdc-theme-secondary, #018786) !important; }
+
+.mdc-theme--background {
+  background-color: #fff;
+  /* @alternate */
+  background-color: var(--mdc-theme-background, #fff); }
+
+.mdc-theme--surface {
+  background-color: #fff;
+  /* @alternate */
+  background-color: var(--mdc-theme-surface, #fff); }
+
+.mdc-theme--on-primary {
+  color: #fff !important;
+  /* @alternate */
+  color: var(--mdc-theme-on-primary, #fff) !important; }
+
+.mdc-theme--on-secondary {
+  color: #fff !important;
+  /* @alternate */
+  color: var(--mdc-theme-on-secondary, #fff) !important; }
+
+.mdc-theme--on-surface {
+  color: #000 !important;
+  /* @alternate */
+  color: var(--mdc-theme-on-surface, #000) !important; }
+
+.mdc-theme--text-primary-on-background {
+  color: rgba(0, 0, 0, 0.87) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-primary-on-background, rgba(0, 0, 0, 0.87)) !important; }
+
+.mdc-theme--text-secondary-on-background {
+  color: rgba(0, 0, 0, 0.54) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-secondary-on-background, rgba(0, 0, 0, 0.54)) !important; }
+
+.mdc-theme--text-hint-on-background {
+  color: rgba(0, 0, 0, 0.38) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-hint-on-background, rgba(0, 0, 0, 0.38)) !important; }
+
+.mdc-theme--text-disabled-on-background {
+  color: rgba(0, 0, 0, 0.38) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-disabled-on-background, rgba(0, 0, 0, 0.38)) !important; }
+
+.mdc-theme--text-icon-on-background {
+  color: rgba(0, 0, 0, 0.38) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-icon-on-background, rgba(0, 0, 0, 0.38)) !important; }
+
+.mdc-theme--text-primary-on-light {
+  color: rgba(0, 0, 0, 0.87) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-primary-on-light, rgba(0, 0, 0, 0.87)) !important; }
+
+.mdc-theme--text-secondary-on-light {
+  color: rgba(0, 0, 0, 0.54) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-secondary-on-light, rgba(0, 0, 0, 0.54)) !important; }
+
+.mdc-theme--text-hint-on-light {
+  color: rgba(0, 0, 0, 0.38) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-hint-on-light, rgba(0, 0, 0, 0.38)) !important; }
+
+.mdc-theme--text-disabled-on-light {
+  color: rgba(0, 0, 0, 0.38) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-disabled-on-light, rgba(0, 0, 0, 0.38)) !important; }
+
+.mdc-theme--text-icon-on-light {
+  color: rgba(0, 0, 0, 0.38) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-icon-on-light, rgba(0, 0, 0, 0.38)) !important; }
+
+.mdc-theme--text-primary-on-dark {
+  color: white !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-primary-on-dark, white) !important; }
+
+.mdc-theme--text-secondary-on-dark {
+  color: rgba(255, 255, 255, 0.7) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-secondary-on-dark, rgba(255, 255, 255, 0.7)) !important; }
+
+.mdc-theme--text-hint-on-dark {
+  color: rgba(255, 255, 255, 0.5) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-hint-on-dark, rgba(255, 255, 255, 0.5)) !important; }
+
+.mdc-theme--text-disabled-on-dark {
+  color: rgba(255, 255, 255, 0.5) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-disabled-on-dark, rgba(255, 255, 255, 0.5)) !important; }
+
+.mdc-theme--text-icon-on-dark {
+  color: rgba(255, 255, 255, 0.5) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-icon-on-dark, rgba(255, 255, 255, 0.5)) !important; }
+
+.mdc-theme--primary-bg {
+  background-color: #6200ee !important;
+  /* @alternate */
+  background-color: var(--mdc-theme-primary, #6200ee) !important; }
+
+.mdc-theme--secondary-bg {
+  background-color: #018786 !important;
+  /* @alternate */
+  background-color: var(--mdc-theme-secondary, #018786) !important; }
+
+/*# sourceMappingURL=mdc.theme.css.map*/
\ No newline at end of file
diff --git a/node_modules/@material/line-ripple/node_modules/@material/theme/dist/mdc.theme.min.css b/node_modules/@material/line-ripple/node_modules/@material/theme/dist/mdc.theme.min.css
new file mode 100644
index 0000000..88b38e2
--- /dev/null
+++ b/node_modules/@material/line-ripple/node_modules/@material/theme/dist/mdc.theme.min.css
@@ -0,0 +1,8 @@
+/*!
+ Material Components for the Web
+ Copyright (c) 2018 Google Inc.
+ License: Apache-2.0
+*/
+:root{--mdc-theme-primary: #6200ee;--mdc-theme-secondary: #018786;--mdc-theme-background: #fff;--mdc-theme-surface: #fff;--mdc-theme-on-primary: #fff;--mdc-theme-on-secondary: #fff;--mdc-theme-on-surface: #000;--mdc-theme-text-primary-on-background: rgba(0,0,0,0.87);--mdc-theme-text-secondary-on-background: rgba(0,0,0,0.54);--mdc-theme-text-hint-on-background: rgba(0,0,0,0.38);--mdc-theme-text-disabled-on-background: rgba(0,0,0,0.38);--mdc-theme-text-icon-on-background: rgba(0,0,0,0.38);--mdc-theme-text-primary-on-light: rgba(0,0,0,0.87);--mdc-theme-text-secondary-on-light: rgba(0,0,0,0.54);--mdc-theme-text-hint-on-light: rgba(0,0,0,0.38);--mdc-theme-text-disabled-on-light: rgba(0,0,0,0.38);--mdc-theme-text-icon-on-light: rgba(0,0,0,0.38);--mdc-theme-text-primary-on-dark: #fff;--mdc-theme-text-secondary-on-dark: rgba(255,255,255,0.7);--mdc-theme-text-hint-on-dark: rgba(255,255,255,0.5);--mdc-theme-text-disabled-on-dark: rgba(255,255,255,0.5);--mdc-theme-text-icon-on-dark: rgba(255,255,255,0.5)}.mdc-theme--primary{color:#6200ee !important;color:var(--mdc-theme-primary, #6200ee) !important}.mdc-theme--secondary{color:#018786 !important;color:var(--mdc-theme-secondary, #018786) !important}.mdc-theme--background{background-color:#fff;background-color:var(--mdc-theme-background, #fff)}.mdc-theme--surface{background-color:#fff;background-color:var(--mdc-theme-surface, #fff)}.mdc-theme--on-primary{color:#fff !important;color:var(--mdc-theme-on-primary, #fff) !important}.mdc-theme--on-secondary{color:#fff !important;color:var(--mdc-theme-on-secondary, #fff) !important}.mdc-theme--on-surface{color:#000 !important;color:var(--mdc-theme-on-surface, #000) !important}.mdc-theme--text-primary-on-background{color:rgba(0,0,0,0.87) !important;color:var(--mdc-theme-text-primary-on-background, rgba(0,0,0,0.87)) !important}.mdc-theme--text-secondary-on-background{color:rgba(0,0,0,0.54) !important;color:var(--mdc-theme-text-secondary-on-background, rgba(0,0,0,0.54)) !important}.mdc-theme--text-hint-on-background{color:rgba(0,0,0,0.38) !important;color:var(--mdc-theme-text-hint-on-background, rgba(0,0,0,0.38)) !important}.mdc-theme--text-disabled-on-background{color:rgba(0,0,0,0.38) !important;color:var(--mdc-theme-text-disabled-on-background, rgba(0,0,0,0.38)) !important}.mdc-theme--text-icon-on-background{color:rgba(0,0,0,0.38) !important;color:var(--mdc-theme-text-icon-on-background, rgba(0,0,0,0.38)) !important}.mdc-theme--text-primary-on-light{color:rgba(0,0,0,0.87) !important;color:var(--mdc-theme-text-primary-on-light, rgba(0,0,0,0.87)) !important}.mdc-theme--text-secondary-on-light{color:rgba(0,0,0,0.54) !important;color:var(--mdc-theme-text-secondary-on-light, rgba(0,0,0,0.54)) !important}.mdc-theme--text-hint-on-light{color:rgba(0,0,0,0.38) !important;color:var(--mdc-theme-text-hint-on-light, rgba(0,0,0,0.38)) !important}.mdc-theme--text-disabled-on-light{color:rgba(0,0,0,0.38) !important;color:var(--mdc-theme-text-disabled-on-light, rgba(0,0,0,0.38)) !important}.mdc-theme--text-icon-on-light{color:rgba(0,0,0,0.38) !important;color:var(--mdc-theme-text-icon-on-light, rgba(0,0,0,0.38)) !important}.mdc-theme--text-primary-on-dark{color:#fff !important;color:var(--mdc-theme-text-primary-on-dark, #fff) !important}.mdc-theme--text-secondary-on-dark{color:rgba(255,255,255,0.7) !important;color:var(--mdc-theme-text-secondary-on-dark, rgba(255,255,255,0.7)) !important}.mdc-theme--text-hint-on-dark{color:rgba(255,255,255,0.5) !important;color:var(--mdc-theme-text-hint-on-dark, rgba(255,255,255,0.5)) !important}.mdc-theme--text-disabled-on-dark{color:rgba(255,255,255,0.5) !important;color:var(--mdc-theme-text-disabled-on-dark, rgba(255,255,255,0.5)) !important}.mdc-theme--text-icon-on-dark{color:rgba(255,255,255,0.5) !important;color:var(--mdc-theme-text-icon-on-dark, rgba(255,255,255,0.5)) !important}.mdc-theme--primary-bg{background-color:#6200ee !important;background-color:var(--mdc-theme-primary, #6200ee) !important}.mdc-theme--secondary-bg{background-color:#018786 !important;background-color:var(--mdc-theme-secondary, #018786) !important}
+
+/*# sourceMappingURL=mdc.theme.min.css.map*/
\ No newline at end of file
diff --git a/node_modules/@material/line-ripple/node_modules/@material/theme/mdc-theme.scss b/node_modules/@material/line-ripple/node_modules/@material/theme/mdc-theme.scss
new file mode 100644
index 0000000..759aae8
--- /dev/null
+++ b/node_modules/@material/line-ripple/node_modules/@material/theme/mdc-theme.scss
@@ -0,0 +1,42 @@
+//
+// Copyright 2017 Google Inc. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+@import "./mixins";
+
+:root {
+  @each $style in map-keys($mdc-theme-property-values) {
+    --mdc-theme-#{$style}: #{map-get($mdc-theme-property-values, $style)};
+  }
+}
+
+@each $style in map-keys($mdc-theme-property-values) {
+  @if $style != "background" and $style != "surface" {
+    .mdc-theme--#{$style} {
+      @include mdc-theme-prop(color, $style, true);
+    }
+  } @else {
+    .mdc-theme--#{$style} {
+      @include mdc-theme-prop(background-color, $style);
+    }
+  }
+}
+
+// CSS rules for using primary and secondary (plus light/dark variants) as background colors.
+@each $style in ("primary", "secondary") {
+  .mdc-theme--#{$style}-bg {
+    @include mdc-theme-prop(background-color, $style, true);
+  }
+}
diff --git a/node_modules/@material/line-ripple/node_modules/@material/theme/package.json b/node_modules/@material/line-ripple/node_modules/@material/theme/package.json
new file mode 100644
index 0000000..4954842
--- /dev/null
+++ b/node_modules/@material/line-ripple/node_modules/@material/theme/package.json
@@ -0,0 +1,45 @@
+{
+  "_from": "@material/theme@^0.38.0",
+  "_id": "@material/theme@0.38.0",
+  "_inBundle": false,
+  "_integrity": "sha512-mP5+qgICPm/0dD3hKa/hMd8AHerkAaLJgEsvBwTXi+N/kpPo9LIrHg40DvUGPs5w6KD9PUuskb3WGBvYcToHvA==",
+  "_location": "/@material/line-ripple/@material/theme",
+  "_phantomChildren": {},
+  "_requested": {
+    "type": "range",
+    "registry": true,
+    "raw": "@material/theme@^0.38.0",
+    "name": "@material/theme",
+    "escapedName": "@material%2ftheme",
+    "scope": "@material",
+    "rawSpec": "^0.38.0",
+    "saveSpec": null,
+    "fetchSpec": "^0.38.0"
+  },
+  "_requiredBy": [
+    "/@material/line-ripple"
+  ],
+  "_resolved": "https://registry.npmjs.org/@material/theme/-/theme-0.38.0.tgz",
+  "_shasum": "c1a2247eba4af2ba47da4456921ab420869fda55",
+  "_spec": "@material/theme@^0.38.0",
+  "_where": "C:\\Users\\jakch\\github\\tool-hub\\node_modules\\@material\\line-ripple",
+  "bugs": {
+    "url": "https://github.com/material-components/material-components-web/issues"
+  },
+  "bundleDependencies": false,
+  "deprecated": false,
+  "description": "The Material Components for the web theming system",
+  "homepage": "https://github.com/material-components/material-components-web#readme",
+  "keywords": [
+    "material components",
+    "material design",
+    "theme"
+  ],
+  "license": "Apache-2.0",
+  "name": "@material/theme",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/material-components/material-components-web.git"
+  },
+  "version": "0.38.0"
+}
diff --git a/node_modules/@material/line-ripple/package.json b/node_modules/@material/line-ripple/package.json
new file mode 100644
index 0000000..c978236
--- /dev/null
+++ b/node_modules/@material/line-ripple/package.json
@@ -0,0 +1,55 @@
+{
+  "_from": "@material/line-ripple@^0.38.0",
+  "_id": "@material/line-ripple@0.38.0",
+  "_inBundle": false,
+  "_integrity": "sha512-HdfU0J1Q3CT2Z/H4aBEKGRTd7K33WhhQkieI4NGGyKSx4uwiRyr61i44Oo+YHK+fVqPjh+aMSjQU3wAfu3vSvA==",
+  "_location": "/@material/line-ripple",
+  "_phantomChildren": {},
+  "_requested": {
+    "type": "range",
+    "registry": true,
+    "raw": "@material/line-ripple@^0.38.0",
+    "name": "@material/line-ripple",
+    "escapedName": "@material%2fline-ripple",
+    "scope": "@material",
+    "rawSpec": "^0.38.0",
+    "saveSpec": null,
+    "fetchSpec": "^0.38.0"
+  },
+  "_requiredBy": [
+    "/@material/textfield"
+  ],
+  "_resolved": "https://registry.npmjs.org/@material/line-ripple/-/line-ripple-0.38.0.tgz",
+  "_shasum": "e70fec82bfd0b718efcbc72c52210e45bd31bcf9",
+  "_spec": "@material/line-ripple@^0.38.0",
+  "_where": "C:\\Users\\jakch\\github\\tool-hub\\node_modules\\@material\\textfield",
+  "bugs": {
+    "url": "https://github.com/material-components/material-components-web/issues"
+  },
+  "bundleDependencies": false,
+  "dependencies": {
+    "@material/animation": "^0.34.0",
+    "@material/base": "^0.35.0",
+    "@material/theme": "^0.38.0"
+  },
+  "deprecated": false,
+  "description": "The Material Components for the web line-ripple component",
+  "homepage": "https://github.com/material-components/material-components-web#readme",
+  "keywords": [
+    "material components",
+    "material design",
+    "lineripple",
+    "line-ripple"
+  ],
+  "license": "Apache-2.0",
+  "main": "index.js",
+  "name": "@material/line-ripple",
+  "publishConfig": {
+    "access": "public"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/material-components/material-components-web.git"
+  },
+  "version": "0.38.0"
+}
diff --git a/node_modules/@material/notched-outline/README.md b/node_modules/@material/notched-outline/README.md
new file mode 100644
index 0000000..c9f19a5
--- /dev/null
+++ b/node_modules/@material/notched-outline/README.md
@@ -0,0 +1,133 @@
+<!--docs:
+title: "Notched Outline"
+layout: detail
+section: components
+excerpt: "The notched outline is a border around either a Text Field or Select element"
+iconId: text_field
+path: /catalog/input-controls/notched-outline/
+-->
+
+# Notched Outline
+
+The notched outline is a border around all sides of either a Text Field or Select component. This is used for the Outlined variant of either a Text Field or Select.
+
+## Design & API Documentation
+
+<ul class="icon-list">
+  <li class="icon-list-item icon-list-item--spec">
+    <a href="https://material.io/go/design-text-fields#text-fields-field-variations">Material Design guidelines: Text Field Variations</a>
+  </li>
+  <li class="icon-list-item icon-list-item--spec">
+    <a href="https://material-components.github.io/material-components-web-catalog/#/component/text-field">Demo with Notched Outline on Text Field</a>
+  </li>
+</ul>
+
+## Basic Usage
+
+### HTML Structure
+
+```html
+<div class="mdc-notched-outline">
+  <svg>
+    <path class="mdc-notched-outline__path"/>
+  </svg>
+</div>
+<div class="mdc-notched-outline__idle"></div>
+```
+
+> For usage within a text field see [here](../mdc-textfield/README.md#outlined).
+
+### Styles
+
+```scss
+@import "@material/notched-outline/mdc-notched-outline";
+```
+
+### JavaScript Instantiation
+
+```js
+import {MDCNotchedOutline} from '@material/notched-outline';
+
+const notchedOutline = new MDCNotchedOutline(document.querySelector('.mdc-notched-outline'));
+```
+
+> See [Importing the JS component](../../docs/importing-js.md) for more information on how to import JavaScript.
+
+## Style Customization
+
+### CSS Classes
+
+CSS Class | Description
+--- | ---
+`mdc-notched-outline` | Mandatory. Container for the SVG of the notched outline path.
+`mdc-notched-outline--notched` | Class to open notch outline.
+`mdc-notched-outline__path` | Mandatory. The path of the SVG of the notched outline.
+`mdc-notched-outline__idle` | Mandatory. The full outline when the notch is hidden.
+
+### Sass Mixins
+
+Mixin | Description
+--- | ---
+`mdc-notched-outline-color($color)` | Customizes the border color of the notched outlined.
+`mdc-notched-outline-idle-color($color)` | Customizes the border color of the idle outline.
+`mdc-notched-outline-stroke-width($width)` | Changes notched outline width to a specified pixel value.
+`mdc-notched-outline-corner-radius($radius)` | Sets the corner radius of the notched outline element to the given number.
+`mdc-notched-outline-idle-corner-radius($radius)` | Sets the corner radius of the notched outline element in idle state.
+
+#### Calling Mixins with Parent Selectors
+
+Because notched-outline has sibling elements, you need to call the "idle" Sass mixins with parent selectors.
+Consider the following example HTML:
+
+```html
+<div class="foo__parent">
+  <div class="mdc-notched-outline foo__child">
+    <svg>
+      <path class="mdc-notched-outline__path"/>
+    </svg>
+  </div>
+  <div class="mdc-notched-outline__idle"></div>
+</div>
+```
+In order to customize any "non-idle" part of notched-outline, use the .foo__child CSS selector:
+```scss
+.foo__child {
+  @include mdc-notched-outline-color($fooColor);
+}
+```
+But in order to customize any "idle" part of the notched-outline, you must use the .foo__parent CSS selector:
+```scss
+.foo__parent {
+  @include mdc-notched-outline-idle-color($fooColor);
+}
+```
+
+## `MDCNotchedOutline` Properties and Methods
+
+Method Signature | Description
+--- | ---
+`notch(notchWidth: number, isRtl: boolean) => void` | Updates notched outline to open notch in outline path.
+`closeNotch() => void` | Updates the notched outline to close notch in outline path.
+
+## Usage Within Frameworks
+
+If you are using a JavaScript framework, such as React or Angular, you can create a Notched Outline for your framework. Depending on your needs, you can use the _Simple Approach: Wrapping MDC Web Vanilla Components_, or the _Advanced Approach: Using Foundations and Adapters_. Please follow the instructions [here](../../docs/integrating-into-frameworks.md).
+
+### `MDCNotchedOutlineAdapter`
+
+Method Signature | Description
+--- | ---
+`getWidth() => number` | Returns the width of the notched outline element.
+`getHeight() => number` | Returns the height of the notched outline element.
+`addClass(className: string) => void` | Adds a class to the notched outline element.
+`removeClass(className: string) => void` | Removes a class from the notched outline element.
+`setOutlinePathAttr(value: string) => void` | Sets the "d" attribute of the notched outline element's SVG path.
+`getIdleOutlineStyleValue(propertyName: string) => string` | Returns the idle outline element's computed style value of a given css `propertyName`.
+
+### `MDCNotchedOutlineFoundation`
+
+Method Signature | Description
+--- | ---
+`notch(notchWidth: number, isRtl: boolean) => void` | Adds the `mdc-notched-outline--notched` selector and updates the notched outline path based off notchWidth and isRtl.
+`closeNotch() => void` | Removes the outline notched selector.
+`updateSvgPath(notchWidth: number, isRtl: boolean) => void` | Updates the SVG path of the focus outline element calculated based off of the notchWidth. The notch will appear left justified, unless isRtl is true.
diff --git a/node_modules/@material/notched-outline/_mixins.scss b/node_modules/@material/notched-outline/_mixins.scss
new file mode 100644
index 0000000..1a672a5
--- /dev/null
+++ b/node_modules/@material/notched-outline/_mixins.scss
@@ -0,0 +1,45 @@
+//
+// Copyright 2018 Google Inc. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+@import "@material/theme/mixins";
+
+@mixin mdc-notched-outline-idle-color($color) {
+  .mdc-notched-outline__idle {
+    @include mdc-theme-prop(border-color, $color);
+  }
+}
+
+@mixin mdc-notched-outline-color($color) {
+  .mdc-notched-outline__path {
+    @include mdc-theme-prop(stroke, $color);
+  }
+}
+
+@mixin mdc-notched-outline-stroke-width($width) {
+  .mdc-notched-outline__path {
+    stroke-width: $width;
+  }
+}
+
+@mixin mdc-notched-outline-corner-radius($radius) {
+  border-radius: $radius;
+}
+
+@mixin mdc-notched-outline-idle-corner-radius($radius) {
+  .mdc-notched-outline__idle {
+    border-radius: $radius;
+  }
+}
diff --git a/node_modules/@material/notched-outline/_variables.scss b/node_modules/@material/notched-outline/_variables.scss
new file mode 100644
index 0000000..dfb5ccd
--- /dev/null
+++ b/node_modules/@material/notched-outline/_variables.scss
@@ -0,0 +1,17 @@
+//
+// Copyright 2018 Google Inc. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+$mdc-notched-outline-transition-duration: 150ms;
diff --git a/node_modules/@material/notched-outline/adapter.js b/node_modules/@material/notched-outline/adapter.js
new file mode 100644
index 0000000..3e8ede3
--- /dev/null
+++ b/node_modules/@material/notched-outline/adapter.js
@@ -0,0 +1,70 @@
+/**
+ * @license
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/* eslint no-unused-vars: [2, {"args": "none"}] */
+
+/**
+ * Adapter for MDC Notched Outline.
+ *
+ * Defines the shape of the adapter expected by the foundation. Implement this
+ * adapter to integrate the Notched Outline into your framework. See
+ * https://github.com/material-components/material-components-web/blob/master/docs/authoring-components.md
+ * for more information.
+ *
+ * @record
+ */
+class MDCNotchedOutlineAdapter {
+  /**
+   * Returns the width of the root element.
+   * @return {number}
+   */
+  getWidth() {}
+
+  /**
+   * Returns the height of the root element.
+   * @return {number}
+   */
+  getHeight() {}
+
+  /**
+   * Adds a class to the root element.
+   * @param {string} className
+   */
+  addClass(className) {}
+
+  /**
+   * Removes a class from the root element.
+   * @param {string} className
+   */
+  removeClass(className) {}
+
+  /**
+   * Sets the "d" attribute of the outline element's SVG path.
+   * @param {string} value
+   */
+  setOutlinePathAttr(value) {}
+
+  /**
+   * Returns the idle outline element's computed style value of the given css property `propertyName`.
+   * We achieve this via `getComputedStyle(...).getPropertyValue(propertyName)`.
+   * @param {string} propertyName
+   * @return {string}
+   */
+  getIdleOutlineStyleValue(propertyName) {}
+}
+
+export default MDCNotchedOutlineAdapter;
diff --git a/node_modules/@material/notched-outline/constants.js b/node_modules/@material/notched-outline/constants.js
new file mode 100644
index 0000000..371da43
--- /dev/null
+++ b/node_modules/@material/notched-outline/constants.js
@@ -0,0 +1,29 @@
+/**
+ * @license
+ * Copyright 2018 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/** @enum {string} */
+const strings = {
+  PATH_SELECTOR: '.mdc-notched-outline__path',
+  IDLE_OUTLINE_SELECTOR: '.mdc-notched-outline__idle',
+};
+
+/** @enum {string} */
+const cssClasses = {
+  OUTLINE_NOTCHED: 'mdc-notched-outline--notched',
+};
+
+export {cssClasses, strings};
diff --git a/node_modules/@material/notched-outline/dist/mdc.notched-outline.css b/node_modules/@material/notched-outline/dist/mdc.notched-outline.css
new file mode 100644
index 0000000..43cf513
--- /dev/null
+++ b/node_modules/@material/notched-outline/dist/mdc.notched-outline.css
@@ -0,0 +1,41 @@
+/*!
+ Material Components for the Web
+ Copyright (c) 2018 Google Inc.
+ License: Apache-2.0
+*/
+.mdc-notched-outline {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: calc(100% - 1px);
+  height: calc(100% - 2px);
+  transition: opacity 150ms cubic-bezier(0.4, 0, 0.2, 1);
+  opacity: 0;
+  overflow: hidden; }
+  .mdc-notched-outline svg {
+    position: absolute;
+    width: 100%;
+    height: 100%; }
+
+.mdc-notched-outline__idle {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: calc(100% - 4px);
+  height: calc(100% - 4px);
+  transition: opacity 150ms cubic-bezier(0.4, 0, 0.2, 1), border-color 150ms cubic-bezier(0.4, 0, 0.2, 1);
+  border: 1px solid;
+  opacity: 1; }
+
+.mdc-notched-outline__path {
+  stroke-width: 1px;
+  transition: stroke 150ms cubic-bezier(0.4, 0, 0.2, 1), stroke-width 150ms cubic-bezier(0.4, 0, 0.2, 1);
+  fill: transparent; }
+
+.mdc-notched-outline--notched {
+  opacity: 1; }
+
+.mdc-notched-outline--notched ~ .mdc-notched-outline__idle {
+  opacity: 0; }
+
+/*# sourceMappingURL=mdc.notched-outline.css.map*/
\ No newline at end of file
diff --git a/node_modules/@material/notched-outline/dist/mdc.notched-outline.min.css b/node_modules/@material/notched-outline/dist/mdc.notched-outline.min.css
new file mode 100644
index 0000000..cd40059
--- /dev/null
+++ b/node_modules/@material/notched-outline/dist/mdc.notched-outline.min.css
@@ -0,0 +1,8 @@
+/*!
+ Material Components for the Web
+ Copyright (c) 2018 Google Inc.
+ License: Apache-2.0
+*/
+.mdc-notched-outline{position:absolute;top:0;left:0;width:calc(100% - 1px);height:calc(100% - 2px);transition:opacity 150ms cubic-bezier(0.4, 0, 0.2, 1);opacity:0;overflow:hidden}.mdc-notched-outline svg{position:absolute;width:100%;height:100%}.mdc-notched-outline__idle{position:absolute;top:0;left:0;width:calc(100% - 4px);height:calc(100% - 4px);transition:opacity 150ms cubic-bezier(0.4, 0, 0.2, 1),border-color 150ms cubic-bezier(0.4, 0, 0.2, 1);border:1px solid;opacity:1}.mdc-notched-outline__path{stroke-width:1px;transition:stroke 150ms cubic-bezier(0.4, 0, 0.2, 1),stroke-width 150ms cubic-bezier(0.4, 0, 0.2, 1);fill:transparent}.mdc-notched-outline--notched{opacity:1}.mdc-notched-outline--notched ~ .mdc-notched-outline__idle{opacity:0}
+
+/*# sourceMappingURL=mdc.notched-outline.min.css.map*/
\ No newline at end of file
diff --git a/node_modules/@material/notched-outline/dist/mdc.notchedOutline.js b/node_modules/@material/notched-outline/dist/mdc.notchedOutline.js
new file mode 100644
index 0000000..dba89a6
--- /dev/null
+++ b/node_modules/@material/notched-outline/dist/mdc.notchedOutline.js
@@ -0,0 +1,802 @@
+/*!
+ Material Components for the Web
+ Copyright (c) 2018 Google Inc.
+ License: Apache-2.0
+*/
+(function webpackUniversalModuleDefinition(root, factory) {
+	if(typeof exports === 'object' && typeof module === 'object')
+		module.exports = factory();
+	else if(typeof define === 'function' && define.amd)
+		define([], factory);
+	else if(typeof exports === 'object')
+		exports["notchedOutline"] = factory();
+	else
+		root["mdc"] = root["mdc"] || {}, root["mdc"]["notchedOutline"] = factory();
+})(this, function() {
+return /******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, {
+/******/ 				configurable: false,
+/******/ 				enumerable: true,
+/******/ 				get: getter
+/******/ 			});
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "";
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = 25);
+/******/ })
+/************************************************************************/
+/******/ ({
+
+/***/ 0:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * @license
+ * Copyright 2016 Google Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * @template A
+ */
+var MDCFoundation = function () {
+  _createClass(MDCFoundation, null, [{
+    key: "cssClasses",
+
+    /** @return enum{cssClasses} */
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports every
+      // CSS class the foundation class needs as a property. e.g. {ACTIVE: 'mdc-component--active'}
+      return {};
+    }
+
+    /** @return enum{strings} */
+
+  }, {
+    key: "strings",
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports all
+      // semantic strings as constants. e.g. {ARIA_ROLE: 'tablist'}
+      return {};
+    }
+
+    /** @return enum{numbers} */
+
+  }, {
+    key: "numbers",
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports all
+      // of its semantic numbers as constants. e.g. {ANIMATION_DELAY_MS: 350}
+      return {};
+    }
+
+    /** @return {!Object} */
+
+  }, {
+    key: "defaultAdapter",
+    get: function get() {
+      // Classes extending MDCFoundation may choose to implement this getter in order to provide a convenient
+      // way of viewing the necessary methods of an adapter. In the future, this could also be used for adapter
+      // validation.
+      return {};
+    }
+
+    /**
+     * @param {A=} adapter
+     */
+
+  }]);
+
+  function MDCFoundation() {
+    var adapter = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+
+    _classCallCheck(this, MDCFoundation);
+
+    /** @protected {!A} */
+    this.adapter_ = adapter;
+  }
+
+  _createClass(MDCFoundation, [{
+    key: "init",
+    value: function init() {
+      // Subclasses should override this method to perform initialization routines (registering events, etc.)
+    }
+  }, {
+    key: "destroy",
+    value: function destroy() {
+      // Subclasses should override this method to perform de-initialization routines (de-registering events, etc.)
+    }
+  }]);
+
+  return MDCFoundation;
+}();
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCFoundation);
+
+/***/ }),
+
+/***/ 1:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__foundation__ = __webpack_require__(0);
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * @license
+ * Copyright 2016 Google Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+/**
+ * @template F
+ */
+
+var MDCComponent = function () {
+  _createClass(MDCComponent, null, [{
+    key: 'attachTo',
+
+    /**
+     * @param {!Element} root
+     * @return {!MDCComponent}
+     */
+    value: function attachTo(root) {
+      // Subclasses which extend MDCBase should provide an attachTo() method that takes a root element and
+      // returns an instantiated component with its root set to that element. Also note that in the cases of
+      // subclasses, an explicit foundation class will not have to be passed in; it will simply be initialized
+      // from getDefaultFoundation().
+      return new MDCComponent(root, new __WEBPACK_IMPORTED_MODULE_0__foundation__["a" /* default */]());
+    }
+
+    /**
+     * @param {!Element} root
+     * @param {F=} foundation
+     * @param {...?} args
+     */
+
+  }]);
+
+  function MDCComponent(root) {
+    var foundation = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : undefined;
+
+    _classCallCheck(this, MDCComponent);
+
+    /** @protected {!Element} */
+    this.root_ = root;
+
+    for (var _len = arguments.length, args = Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++) {
+      args[_key - 2] = arguments[_key];
+    }
+
+    this.initialize.apply(this, args);
+    // Note that we initialize foundation here and not within the constructor's default param so that
+    // this.root_ is defined and can be used within the foundation class.
+    /** @protected {!F} */
+    this.foundation_ = foundation === undefined ? this.getDefaultFoundation() : foundation;
+    this.foundation_.init();
+    this.initialSyncWithDOM();
+  }
+
+  _createClass(MDCComponent, [{
+    key: 'initialize',
+    value: function initialize() /* ...args */{}
+    // Subclasses can override this to do any additional setup work that would be considered part of a
+    // "constructor". Essentially, it is a hook into the parent constructor before the foundation is
+    // initialized. Any additional arguments besides root and foundation will be passed in here.
+
+
+    /**
+     * @return {!F} foundation
+     */
+
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      // Subclasses must override this method to return a properly configured foundation class for the
+      // component.
+      throw new Error('Subclasses must override getDefaultFoundation to return a properly configured ' + 'foundation class');
+    }
+  }, {
+    key: 'initialSyncWithDOM',
+    value: function initialSyncWithDOM() {
+      // Subclasses should override this method if they need to perform work to synchronize with a host DOM
+      // object. An example of this would be a form control wrapper that needs to synchronize its internal state
+      // to some property or attribute of the host DOM. Please note: this is *not* the place to perform DOM
+      // reads/writes that would cause layout / paint, as this is called synchronously from within the constructor.
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      // Subclasses may implement this method to release any resources / deregister any listeners they have
+      // attached. An example of this might be deregistering a resize event from the window object.
+      this.foundation_.destroy();
+    }
+
+    /**
+     * Wrapper method to add an event listener to the component's root element. This is most useful when
+     * listening for custom events.
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: 'listen',
+    value: function listen(evtType, handler) {
+      this.root_.addEventListener(evtType, handler);
+    }
+
+    /**
+     * Wrapper method to remove an event listener to the component's root element. This is most useful when
+     * unlistening for custom events.
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: 'unlisten',
+    value: function unlisten(evtType, handler) {
+      this.root_.removeEventListener(evtType, handler);
+    }
+
+    /**
+     * Fires a cross-browser-compatible custom event from the component root of the given type,
+     * with the given data.
+     * @param {string} evtType
+     * @param {!Object} evtData
+     * @param {boolean=} shouldBubble
+     */
+
+  }, {
+    key: 'emit',
+    value: function emit(evtType, evtData) {
+      var shouldBubble = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
+
+      var evt = void 0;
+      if (typeof CustomEvent === 'function') {
+        evt = new CustomEvent(evtType, {
+          detail: evtData,
+          bubbles: shouldBubble
+        });
+      } else {
+        evt = document.createEvent('CustomEvent');
+        evt.initCustomEvent(evtType, shouldBubble, false, evtData);
+      }
+
+      this.root_.dispatchEvent(evt);
+    }
+  }]);
+
+  return MDCComponent;
+}();
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCComponent);
+
+/***/ }),
+
+/***/ 15:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * @license
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/* eslint no-unused-vars: [2, {"args": "none"}] */
+
+/**
+ * Adapter for MDC Notched Outline.
+ *
+ * Defines the shape of the adapter expected by the foundation. Implement this
+ * adapter to integrate the Notched Outline into your framework. See
+ * https://github.com/material-components/material-components-web/blob/master/docs/authoring-components.md
+ * for more information.
+ *
+ * @record
+ */
+var MDCNotchedOutlineAdapter = function () {
+  function MDCNotchedOutlineAdapter() {
+    _classCallCheck(this, MDCNotchedOutlineAdapter);
+  }
+
+  _createClass(MDCNotchedOutlineAdapter, [{
+    key: "getWidth",
+
+    /**
+     * Returns the width of the root element.
+     * @return {number}
+     */
+    value: function getWidth() {}
+
+    /**
+     * Returns the height of the root element.
+     * @return {number}
+     */
+
+  }, {
+    key: "getHeight",
+    value: function getHeight() {}
+
+    /**
+     * Adds a class to the root element.
+     * @param {string} className
+     */
+
+  }, {
+    key: "addClass",
+    value: function addClass(className) {}
+
+    /**
+     * Removes a class from the root element.
+     * @param {string} className
+     */
+
+  }, {
+    key: "removeClass",
+    value: function removeClass(className) {}
+
+    /**
+     * Sets the "d" attribute of the outline element's SVG path.
+     * @param {string} value
+     */
+
+  }, {
+    key: "setOutlinePathAttr",
+    value: function setOutlinePathAttr(value) {}
+
+    /**
+     * Returns the idle outline element's computed style value of the given css property `propertyName`.
+     * We achieve this via `getComputedStyle(...).getPropertyValue(propertyName)`.
+     * @param {string} propertyName
+     * @return {string}
+     */
+
+  }, {
+    key: "getIdleOutlineStyleValue",
+    value: function getIdleOutlineStyleValue(propertyName) {}
+  }]);
+
+  return MDCNotchedOutlineAdapter;
+}();
+
+/* unused harmony default export */ var _unused_webpack_default_export = (MDCNotchedOutlineAdapter);
+
+/***/ }),
+
+/***/ 16:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return cssClasses; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return strings; });
+/**
+ * @license
+ * Copyright 2018 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/** @enum {string} */
+var strings = {
+  PATH_SELECTOR: '.mdc-notched-outline__path',
+  IDLE_OUTLINE_SELECTOR: '.mdc-notched-outline__idle'
+};
+
+/** @enum {string} */
+var cssClasses = {
+  OUTLINE_NOTCHED: 'mdc-notched-outline--notched'
+};
+
+
+
+/***/ }),
+
+/***/ 25:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MDCNotchedOutline", function() { return MDCNotchedOutline; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_component__ = __webpack_require__(1);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__adapter__ = __webpack_require__(15);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__foundation__ = __webpack_require__(26);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__constants__ = __webpack_require__(16);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCNotchedOutlineFoundation", function() { return __WEBPACK_IMPORTED_MODULE_2__foundation__["a"]; });
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * @license
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+
+/**
+ * @extends {MDCComponent<!MDCNotchedOutlineFoundation>}
+ * @final
+ */
+
+var MDCNotchedOutline = function (_MDCComponent) {
+  _inherits(MDCNotchedOutline, _MDCComponent);
+
+  function MDCNotchedOutline() {
+    _classCallCheck(this, MDCNotchedOutline);
+
+    return _possibleConstructorReturn(this, (MDCNotchedOutline.__proto__ || Object.getPrototypeOf(MDCNotchedOutline)).apply(this, arguments));
+  }
+
+  _createClass(MDCNotchedOutline, [{
+    key: 'notch',
+
+
+    /**
+      * Updates outline selectors and SVG path to open notch.
+      * @param {number} notchWidth The notch width in the outline.
+      * @param {boolean=} isRtl Determines if outline is rtl. If rtl is true, notch
+      * will be right justified in outline path, otherwise left justified.
+      */
+    value: function notch(notchWidth, isRtl) {
+      this.foundation_.notch(notchWidth, isRtl);
+    }
+
+    /**
+     * Updates the outline selectors to close notch and return it to idle state.
+     */
+
+  }, {
+    key: 'closeNotch',
+    value: function closeNotch() {
+      this.foundation_.closeNotch();
+    }
+
+    /**
+     * @return {!MDCNotchedOutlineFoundation}
+     */
+
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      var _this2 = this;
+
+      return new __WEBPACK_IMPORTED_MODULE_2__foundation__["a" /* default */]({
+        getWidth: function getWidth() {
+          return _this2.root_.offsetWidth;
+        },
+        getHeight: function getHeight() {
+          return _this2.root_.offsetHeight;
+        },
+        addClass: function addClass(className) {
+          return _this2.root_.classList.add(className);
+        },
+        removeClass: function removeClass(className) {
+          return _this2.root_.classList.remove(className);
+        },
+        setOutlinePathAttr: function setOutlinePathAttr(value) {
+          var path = _this2.root_.querySelector(__WEBPACK_IMPORTED_MODULE_3__constants__["b" /* strings */].PATH_SELECTOR);
+          path.setAttribute('d', value);
+        },
+        getIdleOutlineStyleValue: function getIdleOutlineStyleValue(propertyName) {
+          var idleOutlineElement = _this2.root_.parentNode.querySelector(__WEBPACK_IMPORTED_MODULE_3__constants__["b" /* strings */].IDLE_OUTLINE_SELECTOR);
+          return window.getComputedStyle(idleOutlineElement).getPropertyValue(propertyName);
+        }
+      });
+    }
+  }], [{
+    key: 'attachTo',
+
+    /**
+     * @param {!Element} root
+     * @return {!MDCNotchedOutline}
+     */
+    value: function attachTo(root) {
+      return new MDCNotchedOutline(root);
+    }
+  }]);
+
+  return MDCNotchedOutline;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_component__["a" /* default */]);
+
+
+
+/***/ }),
+
+/***/ 26:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_foundation__ = __webpack_require__(0);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__adapter__ = __webpack_require__(15);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__constants__ = __webpack_require__(16);
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * @license
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+/**
+ * @extends {MDCFoundation<!MDCNotchedOutlineAdapter>}
+ * @final
+ */
+
+var MDCNotchedOutlineFoundation = function (_MDCFoundation) {
+  _inherits(MDCNotchedOutlineFoundation, _MDCFoundation);
+
+  _createClass(MDCNotchedOutlineFoundation, null, [{
+    key: 'strings',
+
+    /** @return enum {string} */
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["b" /* strings */];
+    }
+
+    /** @return enum {string} */
+
+  }, {
+    key: 'cssClasses',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */];
+    }
+
+    /**
+     * {@see MDCNotchedOutlineAdapter} for typing information on parameters and return
+     * types.
+     * @return {!MDCNotchedOutlineAdapter}
+     */
+
+  }, {
+    key: 'defaultAdapter',
+    get: function get() {
+      return (/** @type {!MDCNotchedOutlineAdapter} */{
+          getWidth: function getWidth() {},
+          getHeight: function getHeight() {},
+          addClass: function addClass() {},
+          removeClass: function removeClass() {},
+          setOutlinePathAttr: function setOutlinePathAttr() {},
+          getIdleOutlineStyleValue: function getIdleOutlineStyleValue() {}
+        }
+      );
+    }
+
+    /**
+     * @param {!MDCNotchedOutlineAdapter} adapter
+     */
+
+  }]);
+
+  function MDCNotchedOutlineFoundation(adapter) {
+    _classCallCheck(this, MDCNotchedOutlineFoundation);
+
+    return _possibleConstructorReturn(this, (MDCNotchedOutlineFoundation.__proto__ || Object.getPrototypeOf(MDCNotchedOutlineFoundation)).call(this, _extends(MDCNotchedOutlineFoundation.defaultAdapter, adapter)));
+  }
+
+  /**
+   * Adds the outline notched selector and updates the notch width
+   * calculated based off of notchWidth and isRtl.
+   * @param {number} notchWidth
+   * @param {boolean=} isRtl
+   */
+
+
+  _createClass(MDCNotchedOutlineFoundation, [{
+    key: 'notch',
+    value: function notch(notchWidth) {
+      var isRtl = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+      var OUTLINE_NOTCHED = MDCNotchedOutlineFoundation.cssClasses.OUTLINE_NOTCHED;
+
+      this.adapter_.addClass(OUTLINE_NOTCHED);
+      this.updateSvgPath_(notchWidth, isRtl);
+    }
+
+    /**
+     * Removes notched outline selector to close the notch in the outline.
+     */
+
+  }, {
+    key: 'closeNotch',
+    value: function closeNotch() {
+      var OUTLINE_NOTCHED = MDCNotchedOutlineFoundation.cssClasses.OUTLINE_NOTCHED;
+
+      this.adapter_.removeClass(OUTLINE_NOTCHED);
+    }
+
+    /**
+     * Updates the SVG path of the focus outline element based on the notchWidth
+     * and the RTL context.
+     * @param {number} notchWidth
+     * @param {boolean=} isRtl
+     * @private
+     */
+
+  }, {
+    key: 'updateSvgPath_',
+    value: function updateSvgPath_(notchWidth, isRtl) {
+      // Fall back to reading a specific corner's style because Firefox doesn't report the style on border-radius.
+      var radiusStyleValue = this.adapter_.getIdleOutlineStyleValue('border-radius') || this.adapter_.getIdleOutlineStyleValue('border-top-left-radius');
+      var radius = parseFloat(radiusStyleValue);
+      var width = this.adapter_.getWidth();
+      var height = this.adapter_.getHeight();
+      var cornerWidth = radius + 1.2;
+      var leadingStrokeLength = Math.abs(11 - cornerWidth);
+      var paddedNotchWidth = notchWidth + 8;
+
+      // The right, bottom, and left sides of the outline follow the same SVG path.
+      var pathMiddle = 'a' + radius + ',' + radius + ' 0 0 1 ' + radius + ',' + radius + 'v' + (height - 2 * cornerWidth) + 'a' + radius + ',' + radius + ' 0 0 1 ' + -radius + ',' + radius + 'h' + (-width + 2 * cornerWidth) + 'a' + radius + ',' + radius + ' 0 0 1 ' + -radius + ',' + -radius + 'v' + (-height + 2 * cornerWidth) + 'a' + radius + ',' + radius + ' 0 0 1 ' + radius + ',' + -radius;
+
+      var path = void 0;
+      if (!isRtl) {
+        path = 'M' + (cornerWidth + leadingStrokeLength + paddedNotchWidth) + ',' + 1 + 'h' + (width - 2 * cornerWidth - paddedNotchWidth - leadingStrokeLength) + pathMiddle + 'h' + leadingStrokeLength;
+      } else {
+        path = 'M' + (width - cornerWidth - leadingStrokeLength) + ',' + 1 + 'h' + leadingStrokeLength + pathMiddle + 'h' + (width - 2 * cornerWidth - paddedNotchWidth - leadingStrokeLength);
+      }
+
+      this.adapter_.setOutlinePathAttr(path);
+    }
+  }]);
+
+  return MDCNotchedOutlineFoundation;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_foundation__["a" /* default */]);
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCNotchedOutlineFoundation);
+
+/***/ })
+
+/******/ });
+});
+//# sourceMappingURL=mdc.notchedOutline.js.map
\ No newline at end of file
diff --git a/node_modules/@material/notched-outline/dist/mdc.notchedOutline.min.js b/node_modules/@material/notched-outline/dist/mdc.notchedOutline.min.js
new file mode 100644
index 0000000..19a4351
--- /dev/null
+++ b/node_modules/@material/notched-outline/dist/mdc.notchedOutline.min.js
@@ -0,0 +1,23 @@
+/*!
+ Material Components for the Web
+ Copyright (c) 2018 Google Inc.
+ License: Apache-2.0
+*/
+!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define([],e):"object"==typeof exports?exports.notchedOutline=e():(t.mdc=t.mdc||{},t.mdc.notchedOutline=e())}(this,function(){return function(t){function e(o){if(n[o])return n[o].exports;var r=n[o]={i:o,l:!1,exports:{}};return t[o].call(r.exports,r,r.exports,e),r.l=!0,r.exports}var n={};return e.m=t,e.c=n,e.d=function(t,n,o){e.o(t,n)||Object.defineProperty(t,n,{configurable:!1,enumerable:!0,get:o})},e.n=function(t){var n=t&&t.__esModule?function(){return t.default}:function(){return t};return e.d(n,"a",n),n},e.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},e.p="",e(e.s=25)}({0:function(t,e,n){"use strict";function o(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}var r=function(){function t(t,e){for(var n=0;n<e.length;n++){var o=e[n];o.enumerable=o.enumerable||!1,o.configurable=!0,"value"in o&&(o.writable=!0),Object.defineProperty(t,o.key,o)}}return function(e,n,o){return n&&t(e.prototype,n),o&&t(e,o),e}}(),i=function(){function t(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};o(this,t),this.adapter_=e}return r(t,null,[{key:"cssClasses",get:function(){return{}}},{key:"strings",get:function(){return{}}},{key:"numbers",get:function(){return{}}},{key:"defaultAdapter",get:function(){return{}}}]),r(t,[{key:"init",value:function(){}},{key:"destroy",value:function(){}}]),t}();e.a=i},1:function(t,e,n){"use strict";function o(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}var r=n(0),i=function(){function t(t,e){for(var n=0;n<e.length;n++){var o=e[n];o.enumerable=o.enumerable||!1,o.configurable=!0,"value"in o&&(o.writable=!0),Object.defineProperty(t,o.key,o)}}return function(e,n,o){return n&&t(e.prototype,n),o&&t(e,o),e}}(),u=function(){function t(e){var n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:void 0;o(this,t),this.root_=e;for(var r=arguments.length,i=Array(r>2?r-2:0),u=2;u<r;u++)i[u-2]=arguments[u];this.initialize.apply(this,i),this.foundation_=void 0===n?this.getDefaultFoundation():n,this.foundation_.init(),this.initialSyncWithDOM()}return i(t,null,[{key:"attachTo",value:function(e){return new t(e,new r.a)}}]),i(t,[{key:"initialize",value:function(){}},{key:"getDefaultFoundation",value:function(){throw new Error("Subclasses must override getDefaultFoundation to return a properly configured foundation class")}},{key:"initialSyncWithDOM",value:function(){}},{key:"destroy",value:function(){this.foundation_.destroy()}},{key:"listen",value:function(t,e){this.root_.addEventListener(t,e)}},{key:"unlisten",value:function(t,e){this.root_.removeEventListener(t,e)}},{key:"emit",value:function(t,e){var n=arguments.length>2&&void 0!==arguments[2]&&arguments[2],o=void 0;"function"==typeof CustomEvent?o=new CustomEvent(t,{detail:e,bubbles:n}):(o=document.createEvent("CustomEvent"),o.initCustomEvent(t,n,!1,e)),this.root_.dispatchEvent(o)}}]),t}();e.a=u},15:function(t,e,n){"use strict";function o(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}var r=function(){function t(t,e){for(var n=0;n<e.length;n++){var o=e[n];o.enumerable=o.enumerable||!1,o.configurable=!0,"value"in o&&(o.writable=!0),Object.defineProperty(t,o.key,o)}}return function(e,n,o){return n&&t(e.prototype,n),o&&t(e,o),e}}();!function(){function t(){o(this,t)}r(t,[{key:"getWidth",value:function(){}},{key:"getHeight",value:function(){}},{key:"addClass",value:function(t){}},{key:"removeClass",value:function(t){}},{key:"setOutlinePathAttr",value:function(t){}},{key:"getIdleOutlineStyleValue",value:function(t){}}])}()},16:function(t,e,n){"use strict";n.d(e,"a",function(){return r}),n.d(e,"b",function(){return o});/**
+ * @license
+ * Copyright 2018 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+var o={PATH_SELECTOR:".mdc-notched-outline__path",IDLE_OUTLINE_SELECTOR:".mdc-notched-outline__idle"},r={OUTLINE_NOTCHED:"mdc-notched-outline--notched"}},25:function(t,e,n){"use strict";function o(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function r(t,e){if(!t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!e||"object"!=typeof e&&"function"!=typeof e?t:e}function i(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),e&&(Object.setPrototypeOf?Object.setPrototypeOf(t,e):t.__proto__=e)}Object.defineProperty(e,"__esModule",{value:!0}),n.d(e,"MDCNotchedOutline",function(){return f});var u=n(1),a=(n(15),n(26)),c=n(16);n.d(e,"MDCNotchedOutlineFoundation",function(){return a.a});var l=function(){function t(t,e){for(var n=0;n<e.length;n++){var o=e[n];o.enumerable=o.enumerable||!1,o.configurable=!0,"value"in o&&(o.writable=!0),Object.defineProperty(t,o.key,o)}}return function(e,n,o){return n&&t(e.prototype,n),o&&t(e,o),e}}(),f=function(t){function e(){return o(this,e),r(this,(e.__proto__||Object.getPrototypeOf(e)).apply(this,arguments))}return i(e,t),l(e,[{key:"notch",value:function(t,e){this.foundation_.notch(t,e)}},{key:"closeNotch",value:function(){this.foundation_.closeNotch()}},{key:"getDefaultFoundation",value:function(){var t=this;return new a.a({getWidth:function(){return t.root_.offsetWidth},getHeight:function(){return t.root_.offsetHeight},addClass:function(e){return t.root_.classList.add(e)},removeClass:function(e){return t.root_.classList.remove(e)},setOutlinePathAttr:function(e){t.root_.querySelector(c.b.PATH_SELECTOR).setAttribute("d",e)},getIdleOutlineStyleValue:function(e){var n=t.root_.parentNode.querySelector(c.b.IDLE_OUTLINE_SELECTOR);return window.getComputedStyle(n).getPropertyValue(e)}})}}],[{key:"attachTo",value:function(t){return new e(t)}}]),e}(u.a)},26:function(t,e,n){"use strict";function o(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function r(t,e){if(!t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!e||"object"!=typeof e&&"function"!=typeof e?t:e}function i(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),e&&(Object.setPrototypeOf?Object.setPrototypeOf(t,e):t.__proto__=e)}var u=n(0),a=(n(15),n(16)),c=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var o in n)Object.prototype.hasOwnProperty.call(n,o)&&(t[o]=n[o])}return t},l=function(){function t(t,e){for(var n=0;n<e.length;n++){var o=e[n];o.enumerable=o.enumerable||!1,o.configurable=!0,"value"in o&&(o.writable=!0),Object.defineProperty(t,o.key,o)}}return function(e,n,o){return n&&t(e.prototype,n),o&&t(e,o),e}}(),f=function(t){function e(t){return o(this,e),r(this,(e.__proto__||Object.getPrototypeOf(e)).call(this,c(e.defaultAdapter,t)))}return i(e,t),l(e,null,[{key:"strings",get:function(){return a.b}},{key:"cssClasses",get:function(){return a.a}},{key:"defaultAdapter",get:function(){return{getWidth:function(){},getHeight:function(){},addClass:function(){},removeClass:function(){},setOutlinePathAttr:function(){},getIdleOutlineStyleValue:function(){}}}}]),l(e,[{key:"notch",value:function(t){var n=arguments.length>1&&void 0!==arguments[1]&&arguments[1],o=e.cssClasses.OUTLINE_NOTCHED;this.adapter_.addClass(o),this.updateSvgPath_(t,n)}},{key:"closeNotch",value:function(){var t=e.cssClasses.OUTLINE_NOTCHED;this.adapter_.removeClass(t)}},{key:"updateSvgPath_",value:function(t,e){var n=this.adapter_.getIdleOutlineStyleValue("border-radius")||this.adapter_.getIdleOutlineStyleValue("border-top-left-radius"),o=parseFloat(n),r=this.adapter_.getWidth(),i=this.adapter_.getHeight(),u=o+1.2,a=Math.abs(11-u),c=t+8,l="a"+o+","+o+" 0 0 1 "+o+","+o+"v"+(i-2*u)+"a"+o+","+o+" 0 0 1 "+-o+","+o+"h"+(2*u-r)+"a"+o+","+o+" 0 0 1 "+-o+","+-o+"v"+(2*u-i)+"a"+o+","+o+" 0 0 1 "+o+","+-o,f=void 0;f=e?"M"+(r-u-a)+",1h"+a+l+"h"+(r-2*u-c-a):"M"+(u+a+c)+",1h"+(r-2*u-c-a)+l+"h"+a,this.adapter_.setOutlinePathAttr(f)}}]),e}(u.a);e.a=f}})});
+//# sourceMappingURL=mdc.notchedOutline.min.js.map
\ No newline at end of file
diff --git a/node_modules/@material/notched-outline/foundation.js b/node_modules/@material/notched-outline/foundation.js
new file mode 100644
index 0000000..44b5e48
--- /dev/null
+++ b/node_modules/@material/notched-outline/foundation.js
@@ -0,0 +1,124 @@
+/**
+ * @license
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import MDCFoundation from '@material/base/foundation';
+import MDCNotchedOutlineAdapter from './adapter';
+import {cssClasses, strings} from './constants';
+
+/**
+ * @extends {MDCFoundation<!MDCNotchedOutlineAdapter>}
+ * @final
+ */
+class MDCNotchedOutlineFoundation extends MDCFoundation {
+  /** @return enum {string} */
+  static get strings() {
+    return strings;
+  }
+
+  /** @return enum {string} */
+  static get cssClasses() {
+    return cssClasses;
+  }
+
+  /**
+   * {@see MDCNotchedOutlineAdapter} for typing information on parameters and return
+   * types.
+   * @return {!MDCNotchedOutlineAdapter}
+   */
+  static get defaultAdapter() {
+    return /** @type {!MDCNotchedOutlineAdapter} */ ({
+      getWidth: () => {},
+      getHeight: () => {},
+      addClass: () => {},
+      removeClass: () => {},
+      setOutlinePathAttr: () => {},
+      getIdleOutlineStyleValue: () => {},
+    });
+  }
+
+  /**
+   * @param {!MDCNotchedOutlineAdapter} adapter
+   */
+  constructor(adapter) {
+    super(Object.assign(MDCNotchedOutlineFoundation.defaultAdapter, adapter));
+  }
+
+  /**
+   * Adds the outline notched selector and updates the notch width
+   * calculated based off of notchWidth and isRtl.
+   * @param {number} notchWidth
+   * @param {boolean=} isRtl
+   */
+  notch(notchWidth, isRtl = false) {
+    const {OUTLINE_NOTCHED} = MDCNotchedOutlineFoundation.cssClasses;
+    this.adapter_.addClass(OUTLINE_NOTCHED);
+    this.updateSvgPath_(notchWidth, isRtl);
+  }
+
+  /**
+   * Removes notched outline selector to close the notch in the outline.
+   */
+  closeNotch() {
+    const {OUTLINE_NOTCHED} = MDCNotchedOutlineFoundation.cssClasses;
+    this.adapter_.removeClass(OUTLINE_NOTCHED);
+  }
+
+  /**
+   * Updates the SVG path of the focus outline element based on the notchWidth
+   * and the RTL context.
+   * @param {number} notchWidth
+   * @param {boolean=} isRtl
+   * @private
+   */
+  updateSvgPath_(notchWidth, isRtl) {
+    // Fall back to reading a specific corner's style because Firefox doesn't report the style on border-radius.
+    const radiusStyleValue = this.adapter_.getIdleOutlineStyleValue('border-radius') ||
+        this.adapter_.getIdleOutlineStyleValue('border-top-left-radius');
+    const radius = parseFloat(radiusStyleValue);
+    const width = this.adapter_.getWidth();
+    const height = this.adapter_.getHeight();
+    const cornerWidth = radius + 1.2;
+    const leadingStrokeLength = Math.abs(11 - cornerWidth);
+    const paddedNotchWidth = notchWidth + 8;
+
+    // The right, bottom, and left sides of the outline follow the same SVG path.
+    const pathMiddle = 'a' + radius + ',' + radius + ' 0 0 1 ' + radius + ',' + radius
+      + 'v' + (height - (2 * cornerWidth))
+      + 'a' + radius + ',' + radius + ' 0 0 1 ' + -radius + ',' + radius
+      + 'h' + (-width + (2 * cornerWidth))
+      + 'a' + radius + ',' + radius + ' 0 0 1 ' + -radius + ',' + -radius
+      + 'v' + (-height + (2 * cornerWidth))
+      + 'a' + radius + ',' + radius + ' 0 0 1 ' + radius + ',' + -radius;
+
+    let path;
+    if (!isRtl) {
+      path = 'M' + (cornerWidth + leadingStrokeLength + paddedNotchWidth) + ',' + 1
+        + 'h' + (width - (2 * cornerWidth) - paddedNotchWidth - leadingStrokeLength)
+        + pathMiddle
+        + 'h' + leadingStrokeLength;
+    } else {
+      path = 'M' + (width - cornerWidth - leadingStrokeLength) + ',' + 1
+        + 'h' + leadingStrokeLength
+        + pathMiddle
+        + 'h' + (width - (2 * cornerWidth) - paddedNotchWidth - leadingStrokeLength);
+    }
+
+    this.adapter_.setOutlinePathAttr(path);
+  }
+}
+
+export default MDCNotchedOutlineFoundation;
diff --git a/node_modules/@material/notched-outline/index.js b/node_modules/@material/notched-outline/index.js
new file mode 100644
index 0000000..d117759
--- /dev/null
+++ b/node_modules/@material/notched-outline/index.js
@@ -0,0 +1,75 @@
+/**
+ * @license
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import MDCComponent from '@material/base/component';
+
+import MDCNotchedOutlineAdapter from './adapter';
+import MDCNotchedOutlineFoundation from './foundation';
+import {strings} from './constants';
+
+/**
+ * @extends {MDCComponent<!MDCNotchedOutlineFoundation>}
+ * @final
+ */
+class MDCNotchedOutline extends MDCComponent {
+  /**
+   * @param {!Element} root
+   * @return {!MDCNotchedOutline}
+   */
+  static attachTo(root) {
+    return new MDCNotchedOutline(root);
+  }
+
+  /**
+    * Updates outline selectors and SVG path to open notch.
+    * @param {number} notchWidth The notch width in the outline.
+    * @param {boolean=} isRtl Determines if outline is rtl. If rtl is true, notch
+    * will be right justified in outline path, otherwise left justified.
+    */
+  notch(notchWidth, isRtl) {
+    this.foundation_.notch(notchWidth, isRtl);
+  }
+
+  /**
+   * Updates the outline selectors to close notch and return it to idle state.
+   */
+  closeNotch() {
+    this.foundation_.closeNotch();
+  }
+
+  /**
+   * @return {!MDCNotchedOutlineFoundation}
+   */
+  getDefaultFoundation() {
+    return new MDCNotchedOutlineFoundation({
+      getWidth: () => this.root_.offsetWidth,
+      getHeight: () => this.root_.offsetHeight,
+      addClass: (className) => this.root_.classList.add(className),
+      removeClass: (className) => this.root_.classList.remove(className),
+      setOutlinePathAttr: (value) => {
+        const path = this.root_.querySelector(strings.PATH_SELECTOR);
+        path.setAttribute('d', value);
+      },
+      getIdleOutlineStyleValue: (propertyName) => {
+        const idleOutlineElement = this.root_.parentNode.querySelector(strings.IDLE_OUTLINE_SELECTOR);
+        return window.getComputedStyle(idleOutlineElement).getPropertyValue(propertyName);
+      },
+    });
+  }
+}
+
+export {MDCNotchedOutline, MDCNotchedOutlineFoundation};
diff --git a/node_modules/@material/notched-outline/mdc-notched-outline.scss b/node_modules/@material/notched-outline/mdc-notched-outline.scss
new file mode 100644
index 0000000..38cd8d3
--- /dev/null
+++ b/node_modules/@material/notched-outline/mdc-notched-outline.scss
@@ -0,0 +1,71 @@
+//
+// Copyright 2017 Google Inc. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+@import "@material/animation/variables";
+@import "@material/base/mixins";
+@import "./mixins";
+@import "./variables";
+
+// Notched Outline is intended for use by multiple components, but its styles should only be emitted once when bundled
+@include mdc-base-emit-once("mdc-notched-outline") {
+  .mdc-notched-outline {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: calc(100% - 1px);
+    height: calc(100% - 2px);
+    transition: opacity $mdc-notched-outline-transition-duration $mdc-animation-standard-curve-timing-function;
+    opacity: 0;
+    overflow: hidden;
+
+    // stylelint-disable selector-max-type
+    svg {
+      position: absolute;
+      width: 100%;
+      height: 100%;
+    }
+    // stylelint-enable selector-max-type
+  }
+
+  .mdc-notched-outline__idle {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: calc(100% - 4px);
+    height: calc(100% - 4px);
+    transition:
+      opacity $mdc-notched-outline-transition-duration $mdc-animation-standard-curve-timing-function,
+      border-color $mdc-notched-outline-transition-duration $mdc-animation-standard-curve-timing-function;
+    border: 1px solid;
+    opacity: 1;
+  }
+
+  .mdc-notched-outline__path {
+    stroke-width: 1px;
+    transition:
+      stroke $mdc-notched-outline-transition-duration $mdc-animation-standard-curve-timing-function,
+      stroke-width $mdc-notched-outline-transition-duration $mdc-animation-standard-curve-timing-function;
+    fill: transparent;
+  }
+
+  .mdc-notched-outline--notched {
+    opacity: 1;
+  }
+
+  .mdc-notched-outline--notched ~ .mdc-notched-outline__idle {
+    opacity: 0;
+  }
+}
diff --git a/node_modules/@material/notched-outline/node_modules/@material/theme/README.md b/node_modules/@material/notched-outline/node_modules/@material/theme/README.md
new file mode 100644
index 0000000..f757529
--- /dev/null
+++ b/node_modules/@material/notched-outline/node_modules/@material/theme/README.md
@@ -0,0 +1,181 @@
+<!--docs:
+title: "Theme"
+layout: detail
+section: components
+excerpt: "Color theming for MDC Web components."
+iconId: theme
+path: /catalog/theme/
+-->
+
+# Theme
+
+The Material Design color system can be used to create a color scheme that reflects your brand or style.
+
+## Design & API Documentation
+
+<ul class="icon-list">
+  <li class="icon-list-item icon-list-item--spec">
+    <a href="https://material.io/go/design-theming">Material Design guidelines: Color</a>
+  </li>
+</ul>
+
+## Installation
+
+```
+npm install @material/theme
+```
+
+## Usage
+
+### Color Scheme
+
+You can define the theme color variables before importing any MDC Web components:
+
+```scss
+$mdc-theme-primary: #fcb8ab;
+$mdc-theme-secondary: #feeae6;
+$mdc-theme-on-primary: #442b2d;
+$mdc-theme-on-secondary: #442b2d;
+
+@import "@material/button/mdc-button";
+```
+
+We suggest you follow the Web Content Accessibility Guidelines 2.0 when picking the values for on-primary, on-secondary, etc. These values should be accessible on top of the corresponding value, e.g. primary and secondary.
+
+https://www.w3.org/TR/WCAG20
+
+### Advanced customization
+
+Color scheme will only get you 80% of the way to a well-designed app. Inevitably there will be some components that do not work "out of the box". To fix problems with accessibility and design, we suggest you use our Sass mixins, such as `mdc-button-filled-accessible`. For more information, consult the documentation for each component.
+
+### Non-Sass customization
+
+Only a very limited number of Material Design color customization features are supported for non-Sass clients. They are a set of CSS custom properties, and a set of CSS classes.
+
+#### CSS Custom Properties
+
+**A note about `<TEXT_STYLE>`**, `<TEXT_STYLE>` represents the lowercase name of the text styles listed above, e.g. `hint`.
+
+CSS Custom property | Description
+--- | ---
+`--mdc-theme-primary` | The theme primary color
+`--mdc-theme-secondary` | The theme secondary color
+`--mdc-theme-background` | The theme background color
+`--mdc-theme-surface` | The theme surface color
+`--mdc-theme-on-primary` | Text color on top of a primary background
+`--mdc-theme-on-secondary` | Text color on top of a secondary background
+`--mdc-theme-on-surface` | Text color on top of a surface background
+`--mdc-theme-text-<TEXT_STYLE>-on-light` | Text color for TEXT_STYLE on top of light background
+`--mdc-theme-text-<TEXT_STYLE>-on-dark` | Text color for TEXT_STYLE on top of dark background
+
+#### CSS Classes
+
+> **A note about `<TEXT_STYLE>`**, `<TEXT_STYLE>` represents the lowercase name of the text styles listed above, e.g. `hint`.
+
+CSS Class | Description
+--- | ---
+`mdc-theme--primary` | Sets the text color to the theme primary color
+`mdc-theme--secondary` | Sets the text color to the theme secondary color
+`mdc-theme--background` | Sets the background color to the theme background color
+`mdc-theme--surface` | Sets the surface color to the theme surface color
+`mdc-theme--on-primary` | Sets the text color to the theme on-primary color
+`mdc-theme--on-secondary` | Sets the text color to the theme on-secondary color
+`mdc-theme--on-surface` | Sets the text color to the theme on-surface color
+`mdc-theme--primary-bg` | Sets the background color to the theme primary color
+`mdc-theme--secondary-bg` | Sets the background color to the theme secondary color
+`mdc-theme--text-<TEXT_STYLE>-on-light` | Sets text to a suitable color for TEXT_STYLE on top of light background
+`mdc-theme--text-<TEXT_STYLE>-on-dark` | Sets text to a suitable color for TEXT_STYLE on top of dark background
+
+### Sass Mixins, Variables, and Functions
+
+Mixin | Description
+--- | ---
+`mdc-theme-prop($property, $style, $important, $edgeOptOut)` | Applies a theme color or a custom color to a CSS property, optionally with `!important`. If `$edgeOptOut` is `true` and a theme color is passed, the style will be wrapped in a `@supports` clause to exclude the style in Edge to avoid issues with its buggy CSS variable support.
+
+#### `mdc-theme-prop` Properties
+
+The properties below can be used as the `$style` argument for the `mdc-theme-prop` mixin. Literal color values (e.g., `rgba(0, 0, 0, .75)`) may also be used instead.
+
+**A note about `<TEXT_STYLE>`**, `<TEXT_STYLE>` represents the lowercase name of the text styles listed above, e.g. `hint`.
+
+Property Name | Description
+--- | ---
+`primary` | The theme primary color
+`secondary` | The theme secondary color
+`background` | The theme background color
+`surface` | The theme surface color
+`text-<TEXT_STYLE>-on-light` | TEXT_STYLE on top of a light background
+`text-<TEXT_STYLE>-on-dark` | TEXT_STYLE on top of a dark background
+`on-primary` | A text/iconography color that is usable on top of primary color
+`on-secondary` | A text/iconography color that is usable on top of secondary color
+`on-surface` | A text/iconography color that is usable on top of surface color
+
+
+#### `mdc-theme-luminance($color)`
+
+Calculates the luminance value (0 - 1) of a given color.
+
+```scss
+@debug mdc-theme-luminance(#9c27b0); // 0.11654
+```
+
+#### `mdc-theme-contrast($back, $front)`
+
+Calculates the contrast ratio between two colors.
+
+```scss
+@debug mdc-theme-contrast(#9c27b0, #000); // 3.33071
+```
+
+#### `mdc-theme-tone($color)`
+
+Determines whether the given color is "light" or "dark".
+
+If the input color is a string literal equal to `"light"` or `"dark"`, it will be returned verbatim.
+
+```scss
+@debug mdc-theme-tone(#9c27b0); // dark
+@debug mdc-theme-tone(light);   // light
+```
+
+#### `mdc-theme-contrast-tone($color)`
+
+Determines whether to use light or dark text on top of a given color.
+
+```scss
+@debug mdc-theme-contrast-tone(#9c27b0); // light
+```
+
+#### `mdc-theme-prop-value($style)`
+
+If `$style` is a color (a literal color value, `currentColor`, or a CSS custom property), it is returned verbatim.
+Otherwise, `$style` is treated as a theme property name, and the corresponding value from `$mdc-theme-property-values`
+is returned. If this also fails, an error is thrown.
+
+This is mainly useful in situations where `mdc-theme-prop` cannot be used directly (e.g., `box-shadow`).
+
+Unlike the `mdc-theme-prop` mixin, this function does _not_ support CSS custom properties.
+It only returns the raw color value of the specified theme property.
+
+> NOTE: This function is defined in `_variables.scss` instead of `_functions.scss` to avoid circular imports.
+
+```scss
+@debug mdc-theme-prop-value(primary); // #3f51b5
+@debug mdc-theme-prop-value(blue);    // blue
+```
+
+#### `mdc-theme-accessible-ink-color($fill-color, $text-style: primary)`
+
+Returns an accessible ink color that has sufficient contrast against the given fill color.
+
+Params:
+
+- `$fill-color`: Supports the same values as `mdc-theme-prop-value`
+- `$text-style`: Value must be one of `primary`, `secondary`, `hint`, `disabled`, `icon` (see `$mdc-theme-text-colors`)
+
+> NOTE: This function is defined in `_variables.scss` instead of `_functions.scss` to avoid circular imports.
+
+```scss
+@debug mdc-theme-accessible-ink-color(secondary); // rgba(0, 0, 0, .87) (text-primary-on-light)
+@debug mdc-theme-accessible-ink-color(blue);      // white              (text-primary-on-dark)
+```
diff --git a/node_modules/@material/notched-outline/node_modules/@material/theme/_color-palette.scss b/node_modules/@material/notched-outline/node_modules/@material/theme/_color-palette.scss
new file mode 100644
index 0000000..ef5122b
--- /dev/null
+++ b/node_modules/@material/notched-outline/node_modules/@material/theme/_color-palette.scss
@@ -0,0 +1,290 @@
+//
+// Copyright 2017 Google Inc. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+// stylelint-disable scss/dollar-variable-pattern, color-hex-length
+
+$material-color-red-50: #ffebee;
+$material-color-red-100: #ffcdd2;
+$material-color-red-200: #ef9a9a;
+$material-color-red-300: #e57373;
+$material-color-red-400: #ef5350;
+$material-color-red-500: #f44336;
+$material-color-red-600: #e53935;
+$material-color-red-700: #d32f2f;
+$material-color-red-800: #c62828;
+$material-color-red-900: #b71c1c;
+$material-color-red-a100: #ff8a80;
+$material-color-red-a200: #ff5252;
+$material-color-red-a400: #ff1744;
+$material-color-red-a700: #d50000;
+
+$material-color-pink-50: #fce4ec;
+$material-color-pink-100: #f8bbd0;
+$material-color-pink-200: #f48fb1;
+$material-color-pink-300: #f06292;
+$material-color-pink-400: #ec407a;
+$material-color-pink-500: #e91e63;
+$material-color-pink-600: #d81b60;
+$material-color-pink-700: #c2185b;
+$material-color-pink-800: #ad1457;
+$material-color-pink-900: #880e4f;
+$material-color-pink-a100: #ff80ab;
+$material-color-pink-a200: #ff4081;
+$material-color-pink-a400: #f50057;
+$material-color-pink-a700: #c51162;
+
+$material-color-purple-50: #f3e5f5;
+$material-color-purple-100: #e1bee7;
+$material-color-purple-200: #ce93d8;
+$material-color-purple-300: #ba68c8;
+$material-color-purple-400: #ab47bc;
+$material-color-purple-500: #9c27b0;
+$material-color-purple-600: #8e24aa;
+$material-color-purple-700: #7b1fa2;
+$material-color-purple-800: #6a1b9a;
+$material-color-purple-900: #4a148c;
+$material-color-purple-a100: #ea80fc;
+$material-color-purple-a200: #e040fb;
+$material-color-purple-a400: #d500f9;
+$material-color-purple-a700: #aa00ff;
+
+$material-color-deep-purple-50: #ede7f6;
+$material-color-deep-purple-100: #d1c4e9;
+$material-color-deep-purple-200: #b39ddb;
+$material-color-deep-purple-300: #9575cd;
+$material-color-deep-purple-400: #7e57c2;
+$material-color-deep-purple-500: #673ab7;
+$material-color-deep-purple-600: #5e35b1;
+$material-color-deep-purple-700: #512da8;
+$material-color-deep-purple-800: #4527a0;
+$material-color-deep-purple-900: #311b92;
+$material-color-deep-purple-a100: #b388ff;
+$material-color-deep-purple-a200: #7c4dff;
+$material-color-deep-purple-a400: #651fff;
+$material-color-deep-purple-a700: #6200ea;
+
+$material-color-indigo-50: #e8eaf6;
+$material-color-indigo-100: #c5cae9;
+$material-color-indigo-200: #9fa8da;
+$material-color-indigo-300: #7986cb;
+$material-color-indigo-400: #5c6bc0;
+$material-color-indigo-500: #3f51b5;
+$material-color-indigo-600: #3949ab;
+$material-color-indigo-700: #303f9f;
+$material-color-indigo-800: #283593;
+$material-color-indigo-900: #1a237e;
+$material-color-indigo-a100: #8c9eff;
+$material-color-indigo-a200: #536dfe;
+$material-color-indigo-a400: #3d5afe;
+$material-color-indigo-a700: #304ffe;
+
+$material-color-blue-50: #e3f2fd;
+$material-color-blue-100: #bbdefb;
+$material-color-blue-200: #90caf9;
+$material-color-blue-300: #64b5f6;
+$material-color-blue-400: #42a5f5;
+$material-color-blue-500: #2196f3;
+$material-color-blue-600: #1e88e5;
+$material-color-blue-700: #1976d2;
+$material-color-blue-800: #1565c0;
+$material-color-blue-900: #0d47a1;
+$material-color-blue-a100: #82b1ff;
+$material-color-blue-a200: #448aff;
+$material-color-blue-a400: #2979ff;
+$material-color-blue-a700: #2962ff;
+
+$material-color-light-blue-50: #e1f5fe;
+$material-color-light-blue-100: #b3e5fc;
+$material-color-light-blue-200: #81d4fa;
+$material-color-light-blue-300: #4fc3f7;
+$material-color-light-blue-400: #29b6f6;
+$material-color-light-blue-500: #03a9f4;
+$material-color-light-blue-600: #039be5;
+$material-color-light-blue-700: #0288d1;
+$material-color-light-blue-800: #0277bd;
+$material-color-light-blue-900: #01579b;
+$material-color-light-blue-a100: #80d8ff;
+$material-color-light-blue-a200: #40c4ff;
+$material-color-light-blue-a400: #00b0ff;
+$material-color-light-blue-a700: #0091ea;
+
+$material-color-cyan-50: #e0f7fa;
+$material-color-cyan-100: #b2ebf2;
+$material-color-cyan-200: #80deea;
+$material-color-cyan-300: #4dd0e1;
+$material-color-cyan-400: #26c6da;
+$material-color-cyan-500: #00bcd4;
+$material-color-cyan-600: #00acc1;
+$material-color-cyan-700: #0097a7;
+$material-color-cyan-800: #00838f;
+$material-color-cyan-900: #006064;
+$material-color-cyan-a100: #84ffff;
+$material-color-cyan-a200: #18ffff;
+$material-color-cyan-a400: #00e5ff;
+$material-color-cyan-a700: #00b8d4;
+
+$material-color-teal-50: #e0f2f1;
+$material-color-teal-100: #b2dfdb;
+$material-color-teal-200: #80cbc4;
+$material-color-teal-300: #4db6ac;
+$material-color-teal-400: #26a69a;
+$material-color-teal-500: #009688;
+$material-color-teal-600: #00897b;
+$material-color-teal-700: #00796b;
+$material-color-teal-800: #00695c;
+$material-color-teal-900: #004d40;
+$material-color-teal-a100: #a7ffeb;
+$material-color-teal-a200: #64ffda;
+$material-color-teal-a400: #1de9b6;
+$material-color-teal-a700: #00bfa5;
+
+$material-color-green-50: #e8f5e9;
+$material-color-green-100: #c8e6c9;
+$material-color-green-200: #a5d6a7;
+$material-color-green-300: #81c784;
+$material-color-green-400: #66bb6a;
+$material-color-green-500: #4caf50;
+$material-color-green-600: #43a047;
+$material-color-green-700: #388e3c;
+$material-color-green-800: #2e7d32;
+$material-color-green-900: #1b5e20;
+$material-color-green-a100: #b9f6ca;
+$material-color-green-a200: #69f0ae;
+$material-color-green-a400: #00e676;
+$material-color-green-a700: #00c853;
+
+$material-color-light-green-50: #f1f8e9;
+$material-color-light-green-100: #dcedc8;
+$material-color-light-green-200: #c5e1a5;
+$material-color-light-green-300: #aed581;
+$material-color-light-green-400: #9ccc65;
+$material-color-light-green-500: #8bc34a;
+$material-color-light-green-600: #7cb342;
+$material-color-light-green-700: #689f38;
+$material-color-light-green-800: #558b2f;
+$material-color-light-green-900: #33691e;
+$material-color-light-green-a100: #ccff90;
+$material-color-light-green-a200: #b2ff59;
+$material-color-light-green-a400: #76ff03;
+$material-color-light-green-a700: #64dd17;
+
+$material-color-lime-50: #f9fbe7;
+$material-color-lime-100: #f0f4c3;
+$material-color-lime-200: #e6ee9c;
+$material-color-lime-300: #dce775;
+$material-color-lime-400: #d4e157;
+$material-color-lime-500: #cddc39;
+$material-color-lime-600: #c0ca33;
+$material-color-lime-700: #afb42b;
+$material-color-lime-800: #9e9d24;
+$material-color-lime-900: #827717;
+$material-color-lime-a100: #f4ff81;
+$material-color-lime-a200: #eeff41;
+$material-color-lime-a400: #c6ff00;
+$material-color-lime-a700: #aeea00;
+
+$material-color-yellow-50: #fffde7;
+$material-color-yellow-100: #fff9c4;
+$material-color-yellow-200: #fff59d;
+$material-color-yellow-300: #fff176;
+$material-color-yellow-400: #ffee58;
+$material-color-yellow-500: #ffeb3b;
+$material-color-yellow-600: #fdd835;
+$material-color-yellow-700: #fbc02d;
+$material-color-yellow-800: #f9a825;
+$material-color-yellow-900: #f57f17;
+$material-color-yellow-a100: #ffff8d;
+$material-color-yellow-a200: #ffff00;
+$material-color-yellow-a400: #ffea00;
+$material-color-yellow-a700: #ffd600;
+
+$material-color-amber-50: #fff8e1;
+$material-color-amber-100: #ffecb3;
+$material-color-amber-200: #ffe082;
+$material-color-amber-300: #ffd54f;
+$material-color-amber-400: #ffca28;
+$material-color-amber-500: #ffc107;
+$material-color-amber-600: #ffb300;
+$material-color-amber-700: #ffa000;
+$material-color-amber-800: #ff8f00;
+$material-color-amber-900: #ff6f00;
+$material-color-amber-a100: #ffe57f;
+$material-color-amber-a200: #ffd740;
+$material-color-amber-a400: #ffc400;
+$material-color-amber-a700: #ffab00;
+
+$material-color-orange-50: #fff3e0;
+$material-color-orange-100: #ffe0b2;
+$material-color-orange-200: #ffcc80;
+$material-color-orange-300: #ffb74d;
+$material-color-orange-400: #ffa726;
+$material-color-orange-500: #ff9800;
+$material-color-orange-600: #fb8c00;
+$material-color-orange-700: #f57c00;
+$material-color-orange-800: #ef6c00;
+$material-color-orange-900: #e65100;
+$material-color-orange-a100: #ffd180;
+$material-color-orange-a200: #ffab40;
+$material-color-orange-a400: #ff9100;
+$material-color-orange-a700: #ff6d00;
+
+$material-color-deep-orange-50: #fbe9e7;
+$material-color-deep-orange-100: #ffccbc;
+$material-color-deep-orange-200: #ffab91;
+$material-color-deep-orange-300: #ff8a65;
+$material-color-deep-orange-400: #ff7043;
+$material-color-deep-orange-500: #ff5722;
+$material-color-deep-orange-600: #f4511e;
+$material-color-deep-orange-700: #e64a19;
+$material-color-deep-orange-800: #d84315;
+$material-color-deep-orange-900: #bf360c;
+$material-color-deep-orange-a100: #ff9e80;
+$material-color-deep-orange-a200: #ff6e40;
+$material-color-deep-orange-a400: #ff3d00;
+$material-color-deep-orange-a700: #dd2c00;
+
+$material-color-brown-50: #efebe9;
+$material-color-brown-100: #d7ccc8;
+$material-color-brown-200: #bcaaa4;
+$material-color-brown-300: #a1887f;
+$material-color-brown-400: #8d6e63;
+$material-color-brown-500: #795548;
+$material-color-brown-600: #6d4c41;
+$material-color-brown-700: #5d4037;
+$material-color-brown-800: #4e342e;
+$material-color-brown-900: #3e2723;
+
+$material-color-grey-50: #fafafa;
+$material-color-grey-100: #f5f5f5;
+$material-color-grey-200: #eeeeee;
+$material-color-grey-300: #e0e0e0;
+$material-color-grey-400: #bdbdbd;
+$material-color-grey-500: #9e9e9e;
+$material-color-grey-600: #757575;
+$material-color-grey-700: #616161;
+$material-color-grey-800: #424242;
+$material-color-grey-900: #212121;
+
+$material-color-blue-grey-50: #eceff1;
+$material-color-blue-grey-100: #cfd8dc;
+$material-color-blue-grey-200: #b0bec5;
+$material-color-blue-grey-300: #90a4ae;
+$material-color-blue-grey-400: #78909c;
+$material-color-blue-grey-500: #607d8b;
+$material-color-blue-grey-600: #546e7a;
+$material-color-blue-grey-700: #455a64;
+$material-color-blue-grey-800: #37474f;
+$material-color-blue-grey-900: #263238;
diff --git a/node_modules/@material/notched-outline/node_modules/@material/theme/_constants.scss b/node_modules/@material/notched-outline/node_modules/@material/theme/_constants.scss
new file mode 100644
index 0000000..baa150d
--- /dev/null
+++ b/node_modules/@material/notched-outline/node_modules/@material/theme/_constants.scss
@@ -0,0 +1,283 @@
+//
+// Copyright 2017 Google Inc. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+// Precomputed linear color channel values, for use in contrast calculations.
+// See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+//
+// Algorithm, for c in 0 to 255:
+// f(c) {
+//   c = c / 255;
+//   return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+// }
+//
+// This lookup table is needed since there is no `pow` in SASS.
+$mdc-theme-linear-channel-values:
+  0
+  .0003035269835488375
+  .000607053967097675
+  .0009105809506465125
+  .00121410793419535
+  .0015176349177441874
+  .001821161901293025
+  .0021246888848418626
+  .0024282158683907
+  .0027317428519395373
+  .003035269835488375
+  .003346535763899161
+  .003676507324047436
+  .004024717018496307
+  .004391442037410293
+  .004776953480693729
+  .005181516702338386
+  .005605391624202723
+  .006048833022857054
+  .006512090792594475
+  .006995410187265387
+  .007499032043226175
+  .008023192985384994
+  .008568125618069307
+  .009134058702220787
+  .00972121732023785
+  .010329823029626936
+  .010960094006488246
+  .011612245179743885
+  .012286488356915872
+  .012983032342173012
+  .013702083047289686
+  .014443843596092545
+  .01520851442291271
+  .01599629336550963
+  .016807375752887384
+  .017641954488384078
+  .018500220128379697
+  .019382360956935723
+  .0202885630566524
+  .021219010376003555
+  .022173884793387385
+  .02315336617811041
+  .024157632448504756
+  .02518685962736163
+  .026241221894849898
+  .027320891639074894
+  .028426039504420793
+  .0295568344378088
+  .030713443732993635
+  .03189603307301153
+  .033104766570885055
+  .03433980680868217
+  .03560131487502034
+  .03688945040110004
+  .0382043715953465
+  .03954623527673284
+  .04091519690685319
+  .042311410620809675
+  .043735029256973465
+  .04518620438567554
+  .046665086336880095
+  .04817182422688942
+  .04970656598412723
+  .05126945837404324
+  .052860647023180246
+  .05448027644244237
+  .05612849004960009
+  .05780543019106723
+  .0595112381629812
+  .06124605423161761
+  .06301001765316767
+  .06480326669290577
+  .06662593864377289
+  .06847816984440017
+  .07036009569659588
+  .07227185068231748
+  .07421356838014963
+  .07618538148130785
+  .07818742180518633
+  .08021982031446832
+  .0822827071298148
+  .08437621154414882
+  .08650046203654976
+  .08865558628577294
+  .09084171118340768
+  .09305896284668745
+  .0953074666309647
+  .09758734714186246
+  .09989872824711389
+  .10224173308810132
+  .10461648409110419
+  .10702310297826761
+  .10946171077829933
+  .1119324278369056
+  .11443537382697373
+  .11697066775851084
+  .11953842798834562
+  .12213877222960187
+  .12477181756095049
+  .12743768043564743
+  .1301364766903643
+  .13286832155381798
+  .13563332965520566
+  .13843161503245183
+  .14126329114027164
+  .14412847085805777
+  .14702726649759498
+  .14995978981060856
+  .15292615199615017
+  .1559264637078274
+  .1589608350608804
+  .162029375639111
+  .1651321945016676
+  .16826940018969075
+  .1714411007328226
+  .17464740365558504
+  .17788841598362912
+  .18116424424986022
+  .184474994500441
+  .18782077230067787
+  .19120168274079138
+  .1946178304415758
+  .19806931955994886
+  .20155625379439707
+  .20507873639031693
+  .20863687014525575
+  .21223075741405523
+  .21586050011389926
+  .2195261997292692
+  .2232279573168085
+  .22696587351009836
+  .23074004852434915
+  .23455058216100522
+  .238397573812271
+  .24228112246555486
+  .24620132670783548
+  .25015828472995344
+  .25415209433082675
+  .2581828529215958
+  .26225065752969623
+  .26635560480286247
+  .2704977910130658
+  .27467731206038465
+  .2788942634768104
+  .2831487404299921
+  .2874408377269175
+  .29177064981753587
+  .2961382707983211
+  .3005437944157765
+  .3049873140698863
+  .30946892281750854
+  .31398871337571754
+  .31854677812509186
+  .32314320911295075
+  .3277780980565422
+  .33245153634617935
+  .33716361504833037
+  .3419144249086609
+  .3467040563550296
+  .35153259950043936
+  .3564001441459435
+  .3613067797835095
+  .3662525955988395
+  .3712376804741491
+  .3762621229909065
+  .38132601143253014
+  .386429433787049
+  .39157247774972326
+  .39675523072562685
+  .4019777798321958
+  .4072402119017367
+  .41254261348390375
+  .4178850708481375
+  .4232676699860717
+  .4286904966139066
+  .43415363617474895
+  .4396571738409188
+  .44520119451622786
+  .45078578283822346
+  .45641102318040466
+  .4620769996544071
+  .467783796112159
+  .47353149614800955
+  .4793201831008268
+  .4851499400560704
+  .4910208498478356
+  .4969329950608704
+  .5028864580325687
+  .5088813208549338
+  .5149176653765214
+  .5209955732043543
+  .5271151257058131
+  .5332764040105052
+  .5394794890121072
+  .5457244613701866
+  .5520114015120001
+  .5583403896342679
+  .5647115057049292
+  .5711248294648731
+  .5775804404296506
+  .5840784178911641
+  .5906188409193369
+  .5972017883637634
+  .6038273388553378
+  .6104955708078648
+  .6172065624196511
+  .6239603916750761
+  .6307571363461468
+  .6375968739940326
+  .6444796819705821
+  .6514056374198242
+  .6583748172794485
+  .665387298282272
+  .6724431569576875
+  .6795424696330938
+  .6866853124353135
+  .6938717612919899
+  .7011018919329731
+  .7083757798916868
+  .7156935005064807
+  .7230551289219693
+  .7304607400903537
+  .7379104087727308
+  .7454042095403874
+  .7529422167760779
+  .7605245046752924
+  .768151147247507
+  .7758222183174236
+  .7835377915261935
+  .7912979403326302
+  .799102738014409
+  .8069522576692516
+  .8148465722161012
+  .8227857543962835
+  .8307698767746546
+  .83879901174074
+  .846873231509858
+  .8549926081242338
+  .8631572134541023
+  .8713671191987972
+  .8796223968878317
+  .8879231178819663
+  .8962693533742664
+  .9046611743911496
+  .9130986517934192
+  .9215818562772946
+  .9301108583754237
+  .938685728457888
+  .9473065367331999
+  .9559733532492861
+  .9646862478944651
+  .9734452903984125
+  .9822505503331171
+  .9911020971138298
+  1;
diff --git a/node_modules/@material/notched-outline/node_modules/@material/theme/_functions.scss b/node_modules/@material/notched-outline/node_modules/@material/theme/_functions.scss
new file mode 100644
index 0000000..acf2ff7
--- /dev/null
+++ b/node_modules/@material/notched-outline/node_modules/@material/theme/_functions.scss
@@ -0,0 +1,60 @@
+//
+// Copyright 2017 Google Inc. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+@import "./constants";
+
+// Calculate the luminance for a color.
+// See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+@function mdc-theme-luminance($color) {
+  $red: nth($mdc-theme-linear-channel-values, red($color) + 1);
+  $green: nth($mdc-theme-linear-channel-values, green($color) + 1);
+  $blue: nth($mdc-theme-linear-channel-values, blue($color) + 1);
+
+  @return .2126 * $red + .7152 * $green + .0722 * $blue;
+}
+
+// Calculate the contrast ratio between two colors.
+// See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+@function mdc-theme-contrast($back, $front) {
+  $backLum: mdc-theme-luminance($back) + .05;
+  $foreLum: mdc-theme-luminance($front) + .05;
+
+  @return max($backLum, $foreLum) / min($backLum, $foreLum);
+}
+
+// Determine whether the color is "light" or "dark".
+@function mdc-theme-tone($color) {
+  @if $color == "dark" or $color == "light" {
+    @return $color;
+  }
+
+  $minimumContrast: 3.1;
+
+  $lightContrast: mdc-theme-contrast($color, white);
+  $darkContrast: mdc-theme-contrast($color, rgba(black, .87));
+
+  @if ($lightContrast < $minimumContrast) and ($darkContrast > $lightContrast) {
+    @return "light";
+  } @else {
+    @return "dark";
+  }
+}
+
+// Determine whether to use dark or light text on top of given color to meet accessibility standards for contrast.
+// Returns "dark" if the given color is light and "light" if the given color is dark.
+@function mdc-theme-contrast-tone($color) {
+  @return if(mdc-theme-tone($color) == "dark", "light", "dark");
+}
diff --git a/node_modules/@material/notched-outline/node_modules/@material/theme/_mixins.scss b/node_modules/@material/notched-outline/node_modules/@material/theme/_mixins.scss
new file mode 100644
index 0000000..9510df2
--- /dev/null
+++ b/node_modules/@material/notched-outline/node_modules/@material/theme/_mixins.scss
@@ -0,0 +1,80 @@
+//
+// Copyright 2017 Google Inc. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+@import "./variables";
+
+// Applies the correct theme color style to the specified property.
+// $property is typically color or background-color, but can be any CSS property that accepts color values.
+// $style should be one of the map keys in $mdc-theme-property-values (_variables.scss), or a color value.
+// $edgeOptOut controls whether to feature-detect around Edge to avoid emitting CSS variables for it,
+// intended for use in cases where interactions with pseudo-element styles cause problems due to Edge bugs.
+@mixin mdc-theme-prop($property, $style, $important: false, $edgeOptOut: false) {
+  @if mdc-theme-is-valid-theme-prop-value_($style) {
+    @if $important {
+      #{$property}: $style !important;
+    } @else {
+      #{$property}: $style;
+    }
+  } @else {
+    @if not map-has-key($mdc-theme-property-values, $style) {
+      @error "Invalid style: '#{$style}'. Choose one of: #{map-keys($mdc-theme-property-values)}";
+    }
+
+    $value: map-get($mdc-theme-property-values, $style);
+
+    @if $important {
+      #{$property}: $value !important;
+
+      @if $edgeOptOut {
+        // stylelint-disable max-nesting-depth
+        @at-root {
+          @supports not (-ms-ime-align:auto) {
+            // stylelint-disable scss/selector-no-redundant-nesting-selector
+            & {
+              /* @alternate */
+              #{$property}: var(--mdc-theme-#{$style}, $value) !important;
+            }
+            // stylelint-enable scss/selector-no-redundant-nesting-selector
+          }
+        }
+        // stylelint-enable max-nesting-depth
+      } @else {
+        /* @alternate */
+        #{$property}: var(--mdc-theme-#{$style}, $value) !important;
+      }
+    } @else {
+      #{$property}: $value;
+
+      @if $edgeOptOut {
+        // stylelint-disable max-nesting-depth
+        @at-root {
+          @supports not (-ms-ime-align:auto) {
+            // stylelint-disable scss/selector-no-redundant-nesting-selector
+            & {
+              /* @alternate */
+              #{$property}: var(--mdc-theme-#{$style}, $value);
+            }
+            // stylelint-enable scss/selector-no-redundant-nesting-selector
+          }
+        }
+        // stylelint-enable max-nesting-depth
+      } @else {
+        /* @alternate */
+        #{$property}: var(--mdc-theme-#{$style}, $value);
+      }
+    }
+  }
+}
diff --git a/node_modules/@material/notched-outline/node_modules/@material/theme/_variables.scss b/node_modules/@material/notched-outline/node_modules/@material/theme/_variables.scss
new file mode 100644
index 0000000..8c962f3
--- /dev/null
+++ b/node_modules/@material/notched-outline/node_modules/@material/theme/_variables.scss
@@ -0,0 +1,140 @@
+//
+// Copyright 2017 Google Inc. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+@import "./functions";
+
+//
+// Main theme colors for your brand.
+//
+// If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+//
+
+$mdc-theme-primary: #6200ee !default; // baseline purple, 500 tone
+$mdc-theme-on-primary: if(mdc-theme-contrast-tone($mdc-theme-primary) == "dark", #000, #fff) !default;
+
+// The $mdc-theme-accent variable is DEPRECATED - it exists purely for backward compatibility.
+// The $mdc-theme-secondary* variables should be used for all new projects.
+$mdc-theme-accent: #018786 !default; // baseline teal, 600 tone
+$mdc-theme-secondary: $mdc-theme-accent !default;
+$mdc-theme-on-secondary: if(mdc-theme-contrast-tone($mdc-theme-secondary) == "dark", #000, #fff) !default;
+$mdc-theme-background: #fff !default; // White
+
+$mdc-theme-surface: #fff !default;
+$mdc-theme-on-surface: if(mdc-theme-contrast-tone($mdc-theme-surface) == "dark", #000, #fff) !default;
+
+//
+// Text colors according to light vs dark and text type.
+//
+
+$mdc-theme-text-colors: (
+  dark: (
+    primary: rgba(black, .87),
+    secondary: rgba(black, .54),
+    hint: rgba(black, .38),
+    disabled: rgba(black, .38),
+    icon: rgba(black, .38)
+  ),
+  light: (
+    primary: white,
+    secondary: rgba(white, .7),
+    hint: rgba(white, .5),
+    disabled: rgba(white, .5),
+    icon: rgba(white, .5)
+  )
+) !default;
+
+@function mdc-theme-ink-color-for-fill_($text-style, $fill-color) {
+  $contrast-tone: mdc-theme-contrast-tone($fill-color);
+
+  @return map-get(map-get($mdc-theme-text-colors, $contrast-tone), $text-style);
+}
+
+//
+// Primary text colors for each of the theme colors.
+//
+
+$mdc-theme-property-values: (
+  // Primary
+  primary: $mdc-theme-primary,
+  // Secondary
+  secondary: $mdc-theme-secondary,
+  // Background
+  background: $mdc-theme-background,
+  // Surface
+  surface: $mdc-theme-surface,
+  on-primary: $mdc-theme-on-primary,
+  on-secondary: $mdc-theme-on-secondary,
+  on-surface: $mdc-theme-on-surface,
+  // Text-primary on "background" background
+  text-primary-on-background: mdc-theme-ink-color-for-fill_(primary, $mdc-theme-background),
+  text-secondary-on-background: mdc-theme-ink-color-for-fill_(secondary, $mdc-theme-background),
+  text-hint-on-background: mdc-theme-ink-color-for-fill_(hint, $mdc-theme-background),
+  text-disabled-on-background: mdc-theme-ink-color-for-fill_(disabled, $mdc-theme-background),
+  text-icon-on-background: mdc-theme-ink-color-for-fill_(icon, $mdc-theme-background),
+  // Text-primary on "light" background
+  text-primary-on-light: mdc-theme-ink-color-for-fill_(primary, light),
+  text-secondary-on-light: mdc-theme-ink-color-for-fill_(secondary, light),
+  text-hint-on-light: mdc-theme-ink-color-for-fill_(hint, light),
+  text-disabled-on-light: mdc-theme-ink-color-for-fill_(disabled, light),
+  text-icon-on-light: mdc-theme-ink-color-for-fill_(icon, light),
+  // Text-primary on "dark" background
+  text-primary-on-dark: mdc-theme-ink-color-for-fill_(primary, dark),
+  text-secondary-on-dark: mdc-theme-ink-color-for-fill_(secondary, dark),
+  text-hint-on-dark: mdc-theme-ink-color-for-fill_(hint, dark),
+  text-disabled-on-dark: mdc-theme-ink-color-for-fill_(disabled, dark),
+  text-icon-on-dark: mdc-theme-ink-color-for-fill_(icon, dark)
+);
+
+// If `$style` is a color (a literal color value, `currentColor`, or a CSS custom property), it is returned verbatim.
+// Otherwise, `$style` is treated as a theme property name, and the corresponding value from
+// `$mdc-theme-property-values` is returned. If this also fails, an error is thrown.
+//
+// This is mainly useful in situations where `mdc-theme-prop` cannot be used directly (e.g., `box-shadow`).
+//
+// Examples:
+//
+// 1. mdc-theme-prop-value(primary) => "#6200ee"
+// 2. mdc-theme-prop-value(blue)    => "blue"
+//
+// NOTE: This function must be defined in _variables.scss instead of _functions.scss to avoid circular imports.
+@function mdc-theme-prop-value($style) {
+  @if mdc-theme-is-valid-theme-prop-value_($style) {
+    @return $style;
+  }
+
+  @if not map-has-key($mdc-theme-property-values, $style) {
+    @error "Invalid theme property: '#{$style}'. Choose one of: #{map-keys($mdc-theme-property-values)}";
+  }
+
+  @return map-get($mdc-theme-property-values, $style);
+}
+
+// NOTE: This function must be defined in _variables.scss instead of _functions.scss to avoid circular imports.
+@function mdc-theme-accessible-ink-color($fill-color, $text-style: primary) {
+  $fill-color-value: mdc-theme-prop-value($fill-color);
+  $color-map-for-tone: map-get($mdc-theme-text-colors, mdc-theme-contrast-tone($fill-color-value));
+
+  @if not map-has-key($color-map-for-tone, $text-style) {
+    @error "Invalid $text-style: '#{$text-style}'. Choose one of: #{map-keys($color-map-for-tone)}";
+  }
+
+  @return map-get($color-map-for-tone, $text-style);
+}
+
+// NOTE: This function is depended upon by mdc-theme-prop-value (above) and thus must be defined in this file.
+@function mdc-theme-is-valid-theme-prop-value_($style) {
+  @return type-of($style) == "color" or $style == "currentColor" or str_slice($style, 1, 4) == "var(";
+}
diff --git a/node_modules/@material/notched-outline/node_modules/@material/theme/dist/mdc.theme.css b/node_modules/@material/notched-outline/node_modules/@material/theme/dist/mdc.theme.css
new file mode 100644
index 0000000..9d4696f
--- /dev/null
+++ b/node_modules/@material/notched-outline/node_modules/@material/theme/dist/mdc.theme.css
@@ -0,0 +1,150 @@
+/*!
+ Material Components for the Web
+ Copyright (c) 2018 Google Inc.
+ License: Apache-2.0
+*/
+:root {
+  --mdc-theme-primary: #6200ee;
+  --mdc-theme-secondary: #018786;
+  --mdc-theme-background: #fff;
+  --mdc-theme-surface: #fff;
+  --mdc-theme-on-primary: #fff;
+  --mdc-theme-on-secondary: #fff;
+  --mdc-theme-on-surface: #000;
+  --mdc-theme-text-primary-on-background: rgba(0, 0, 0, 0.87);
+  --mdc-theme-text-secondary-on-background: rgba(0, 0, 0, 0.54);
+  --mdc-theme-text-hint-on-background: rgba(0, 0, 0, 0.38);
+  --mdc-theme-text-disabled-on-background: rgba(0, 0, 0, 0.38);
+  --mdc-theme-text-icon-on-background: rgba(0, 0, 0, 0.38);
+  --mdc-theme-text-primary-on-light: rgba(0, 0, 0, 0.87);
+  --mdc-theme-text-secondary-on-light: rgba(0, 0, 0, 0.54);
+  --mdc-theme-text-hint-on-light: rgba(0, 0, 0, 0.38);
+  --mdc-theme-text-disabled-on-light: rgba(0, 0, 0, 0.38);
+  --mdc-theme-text-icon-on-light: rgba(0, 0, 0, 0.38);
+  --mdc-theme-text-primary-on-dark: white;
+  --mdc-theme-text-secondary-on-dark: rgba(255, 255, 255, 0.7);
+  --mdc-theme-text-hint-on-dark: rgba(255, 255, 255, 0.5);
+  --mdc-theme-text-disabled-on-dark: rgba(255, 255, 255, 0.5);
+  --mdc-theme-text-icon-on-dark: rgba(255, 255, 255, 0.5); }
+
+.mdc-theme--primary {
+  color: #6200ee !important;
+  /* @alternate */
+  color: var(--mdc-theme-primary, #6200ee) !important; }
+
+.mdc-theme--secondary {
+  color: #018786 !important;
+  /* @alternate */
+  color: var(--mdc-theme-secondary, #018786) !important; }
+
+.mdc-theme--background {
+  background-color: #fff;
+  /* @alternate */
+  background-color: var(--mdc-theme-background, #fff); }
+
+.mdc-theme--surface {
+  background-color: #fff;
+  /* @alternate */
+  background-color: var(--mdc-theme-surface, #fff); }
+
+.mdc-theme--on-primary {
+  color: #fff !important;
+  /* @alternate */
+  color: var(--mdc-theme-on-primary, #fff) !important; }
+
+.mdc-theme--on-secondary {
+  color: #fff !important;
+  /* @alternate */
+  color: var(--mdc-theme-on-secondary, #fff) !important; }
+
+.mdc-theme--on-surface {
+  color: #000 !important;
+  /* @alternate */
+  color: var(--mdc-theme-on-surface, #000) !important; }
+
+.mdc-theme--text-primary-on-background {
+  color: rgba(0, 0, 0, 0.87) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-primary-on-background, rgba(0, 0, 0, 0.87)) !important; }
+
+.mdc-theme--text-secondary-on-background {
+  color: rgba(0, 0, 0, 0.54) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-secondary-on-background, rgba(0, 0, 0, 0.54)) !important; }
+
+.mdc-theme--text-hint-on-background {
+  color: rgba(0, 0, 0, 0.38) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-hint-on-background, rgba(0, 0, 0, 0.38)) !important; }
+
+.mdc-theme--text-disabled-on-background {
+  color: rgba(0, 0, 0, 0.38) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-disabled-on-background, rgba(0, 0, 0, 0.38)) !important; }
+
+.mdc-theme--text-icon-on-background {
+  color: rgba(0, 0, 0, 0.38) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-icon-on-background, rgba(0, 0, 0, 0.38)) !important; }
+
+.mdc-theme--text-primary-on-light {
+  color: rgba(0, 0, 0, 0.87) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-primary-on-light, rgba(0, 0, 0, 0.87)) !important; }
+
+.mdc-theme--text-secondary-on-light {
+  color: rgba(0, 0, 0, 0.54) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-secondary-on-light, rgba(0, 0, 0, 0.54)) !important; }
+
+.mdc-theme--text-hint-on-light {
+  color: rgba(0, 0, 0, 0.38) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-hint-on-light, rgba(0, 0, 0, 0.38)) !important; }
+
+.mdc-theme--text-disabled-on-light {
+  color: rgba(0, 0, 0, 0.38) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-disabled-on-light, rgba(0, 0, 0, 0.38)) !important; }
+
+.mdc-theme--text-icon-on-light {
+  color: rgba(0, 0, 0, 0.38) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-icon-on-light, rgba(0, 0, 0, 0.38)) !important; }
+
+.mdc-theme--text-primary-on-dark {
+  color: white !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-primary-on-dark, white) !important; }
+
+.mdc-theme--text-secondary-on-dark {
+  color: rgba(255, 255, 255, 0.7) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-secondary-on-dark, rgba(255, 255, 255, 0.7)) !important; }
+
+.mdc-theme--text-hint-on-dark {
+  color: rgba(255, 255, 255, 0.5) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-hint-on-dark, rgba(255, 255, 255, 0.5)) !important; }
+
+.mdc-theme--text-disabled-on-dark {
+  color: rgba(255, 255, 255, 0.5) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-disabled-on-dark, rgba(255, 255, 255, 0.5)) !important; }
+
+.mdc-theme--text-icon-on-dark {
+  color: rgba(255, 255, 255, 0.5) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-icon-on-dark, rgba(255, 255, 255, 0.5)) !important; }
+
+.mdc-theme--primary-bg {
+  background-color: #6200ee !important;
+  /* @alternate */
+  background-color: var(--mdc-theme-primary, #6200ee) !important; }
+
+.mdc-theme--secondary-bg {
+  background-color: #018786 !important;
+  /* @alternate */
+  background-color: var(--mdc-theme-secondary, #018786) !important; }
+
+/*# sourceMappingURL=mdc.theme.css.map*/
\ No newline at end of file
diff --git a/node_modules/@material/notched-outline/node_modules/@material/theme/dist/mdc.theme.min.css b/node_modules/@material/notched-outline/node_modules/@material/theme/dist/mdc.theme.min.css
new file mode 100644
index 0000000..88b38e2
--- /dev/null
+++ b/node_modules/@material/notched-outline/node_modules/@material/theme/dist/mdc.theme.min.css
@@ -0,0 +1,8 @@
+/*!
+ Material Components for the Web
+ Copyright (c) 2018 Google Inc.
+ License: Apache-2.0
+*/
+:root{--mdc-theme-primary: #6200ee;--mdc-theme-secondary: #018786;--mdc-theme-background: #fff;--mdc-theme-surface: #fff;--mdc-theme-on-primary: #fff;--mdc-theme-on-secondary: #fff;--mdc-theme-on-surface: #000;--mdc-theme-text-primary-on-background: rgba(0,0,0,0.87);--mdc-theme-text-secondary-on-background: rgba(0,0,0,0.54);--mdc-theme-text-hint-on-background: rgba(0,0,0,0.38);--mdc-theme-text-disabled-on-background: rgba(0,0,0,0.38);--mdc-theme-text-icon-on-background: rgba(0,0,0,0.38);--mdc-theme-text-primary-on-light: rgba(0,0,0,0.87);--mdc-theme-text-secondary-on-light: rgba(0,0,0,0.54);--mdc-theme-text-hint-on-light: rgba(0,0,0,0.38);--mdc-theme-text-disabled-on-light: rgba(0,0,0,0.38);--mdc-theme-text-icon-on-light: rgba(0,0,0,0.38);--mdc-theme-text-primary-on-dark: #fff;--mdc-theme-text-secondary-on-dark: rgba(255,255,255,0.7);--mdc-theme-text-hint-on-dark: rgba(255,255,255,0.5);--mdc-theme-text-disabled-on-dark: rgba(255,255,255,0.5);--mdc-theme-text-icon-on-dark: rgba(255,255,255,0.5)}.mdc-theme--primary{color:#6200ee !important;color:var(--mdc-theme-primary, #6200ee) !important}.mdc-theme--secondary{color:#018786 !important;color:var(--mdc-theme-secondary, #018786) !important}.mdc-theme--background{background-color:#fff;background-color:var(--mdc-theme-background, #fff)}.mdc-theme--surface{background-color:#fff;background-color:var(--mdc-theme-surface, #fff)}.mdc-theme--on-primary{color:#fff !important;color:var(--mdc-theme-on-primary, #fff) !important}.mdc-theme--on-secondary{color:#fff !important;color:var(--mdc-theme-on-secondary, #fff) !important}.mdc-theme--on-surface{color:#000 !important;color:var(--mdc-theme-on-surface, #000) !important}.mdc-theme--text-primary-on-background{color:rgba(0,0,0,0.87) !important;color:var(--mdc-theme-text-primary-on-background, rgba(0,0,0,0.87)) !important}.mdc-theme--text-secondary-on-background{color:rgba(0,0,0,0.54) !important;color:var(--mdc-theme-text-secondary-on-background, rgba(0,0,0,0.54)) !important}.mdc-theme--text-hint-on-background{color:rgba(0,0,0,0.38) !important;color:var(--mdc-theme-text-hint-on-background, rgba(0,0,0,0.38)) !important}.mdc-theme--text-disabled-on-background{color:rgba(0,0,0,0.38) !important;color:var(--mdc-theme-text-disabled-on-background, rgba(0,0,0,0.38)) !important}.mdc-theme--text-icon-on-background{color:rgba(0,0,0,0.38) !important;color:var(--mdc-theme-text-icon-on-background, rgba(0,0,0,0.38)) !important}.mdc-theme--text-primary-on-light{color:rgba(0,0,0,0.87) !important;color:var(--mdc-theme-text-primary-on-light, rgba(0,0,0,0.87)) !important}.mdc-theme--text-secondary-on-light{color:rgba(0,0,0,0.54) !important;color:var(--mdc-theme-text-secondary-on-light, rgba(0,0,0,0.54)) !important}.mdc-theme--text-hint-on-light{color:rgba(0,0,0,0.38) !important;color:var(--mdc-theme-text-hint-on-light, rgba(0,0,0,0.38)) !important}.mdc-theme--text-disabled-on-light{color:rgba(0,0,0,0.38) !important;color:var(--mdc-theme-text-disabled-on-light, rgba(0,0,0,0.38)) !important}.mdc-theme--text-icon-on-light{color:rgba(0,0,0,0.38) !important;color:var(--mdc-theme-text-icon-on-light, rgba(0,0,0,0.38)) !important}.mdc-theme--text-primary-on-dark{color:#fff !important;color:var(--mdc-theme-text-primary-on-dark, #fff) !important}.mdc-theme--text-secondary-on-dark{color:rgba(255,255,255,0.7) !important;color:var(--mdc-theme-text-secondary-on-dark, rgba(255,255,255,0.7)) !important}.mdc-theme--text-hint-on-dark{color:rgba(255,255,255,0.5) !important;color:var(--mdc-theme-text-hint-on-dark, rgba(255,255,255,0.5)) !important}.mdc-theme--text-disabled-on-dark{color:rgba(255,255,255,0.5) !important;color:var(--mdc-theme-text-disabled-on-dark, rgba(255,255,255,0.5)) !important}.mdc-theme--text-icon-on-dark{color:rgba(255,255,255,0.5) !important;color:var(--mdc-theme-text-icon-on-dark, rgba(255,255,255,0.5)) !important}.mdc-theme--primary-bg{background-color:#6200ee !important;background-color:var(--mdc-theme-primary, #6200ee) !important}.mdc-theme--secondary-bg{background-color:#018786 !important;background-color:var(--mdc-theme-secondary, #018786) !important}
+
+/*# sourceMappingURL=mdc.theme.min.css.map*/
\ No newline at end of file
diff --git a/node_modules/@material/notched-outline/node_modules/@material/theme/mdc-theme.scss b/node_modules/@material/notched-outline/node_modules/@material/theme/mdc-theme.scss
new file mode 100644
index 0000000..759aae8
--- /dev/null
+++ b/node_modules/@material/notched-outline/node_modules/@material/theme/mdc-theme.scss
@@ -0,0 +1,42 @@
+//
+// Copyright 2017 Google Inc. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+@import "./mixins";
+
+:root {
+  @each $style in map-keys($mdc-theme-property-values) {
+    --mdc-theme-#{$style}: #{map-get($mdc-theme-property-values, $style)};
+  }
+}
+
+@each $style in map-keys($mdc-theme-property-values) {
+  @if $style != "background" and $style != "surface" {
+    .mdc-theme--#{$style} {
+      @include mdc-theme-prop(color, $style, true);
+    }
+  } @else {
+    .mdc-theme--#{$style} {
+      @include mdc-theme-prop(background-color, $style);
+    }
+  }
+}
+
+// CSS rules for using primary and secondary (plus light/dark variants) as background colors.
+@each $style in ("primary", "secondary") {
+  .mdc-theme--#{$style}-bg {
+    @include mdc-theme-prop(background-color, $style, true);
+  }
+}
diff --git a/node_modules/@material/notched-outline/node_modules/@material/theme/package.json b/node_modules/@material/notched-outline/node_modules/@material/theme/package.json
new file mode 100644
index 0000000..c12a489
--- /dev/null
+++ b/node_modules/@material/notched-outline/node_modules/@material/theme/package.json
@@ -0,0 +1,45 @@
+{
+  "_from": "@material/theme@^0.38.0",
+  "_id": "@material/theme@0.38.0",
+  "_inBundle": false,
+  "_integrity": "sha512-mP5+qgICPm/0dD3hKa/hMd8AHerkAaLJgEsvBwTXi+N/kpPo9LIrHg40DvUGPs5w6KD9PUuskb3WGBvYcToHvA==",
+  "_location": "/@material/notched-outline/@material/theme",
+  "_phantomChildren": {},
+  "_requested": {
+    "type": "range",
+    "registry": true,
+    "raw": "@material/theme@^0.38.0",
+    "name": "@material/theme",
+    "escapedName": "@material%2ftheme",
+    "scope": "@material",
+    "rawSpec": "^0.38.0",
+    "saveSpec": null,
+    "fetchSpec": "^0.38.0"
+  },
+  "_requiredBy": [
+    "/@material/notched-outline"
+  ],
+  "_resolved": "https://registry.npmjs.org/@material/theme/-/theme-0.38.0.tgz",
+  "_shasum": "c1a2247eba4af2ba47da4456921ab420869fda55",
+  "_spec": "@material/theme@^0.38.0",
+  "_where": "C:\\Users\\jakch\\github\\tool-hub\\node_modules\\@material\\notched-outline",
+  "bugs": {
+    "url": "https://github.com/material-components/material-components-web/issues"
+  },
+  "bundleDependencies": false,
+  "deprecated": false,
+  "description": "The Material Components for the web theming system",
+  "homepage": "https://github.com/material-components/material-components-web#readme",
+  "keywords": [
+    "material components",
+    "material design",
+    "theme"
+  ],
+  "license": "Apache-2.0",
+  "name": "@material/theme",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/material-components/material-components-web.git"
+  },
+  "version": "0.38.0"
+}
diff --git a/node_modules/@material/notched-outline/package.json b/node_modules/@material/notched-outline/package.json
new file mode 100644
index 0000000..e828219
--- /dev/null
+++ b/node_modules/@material/notched-outline/package.json
@@ -0,0 +1,57 @@
+{
+  "_from": "@material/notched-outline",
+  "_id": "@material/notched-outline@0.38.0",
+  "_inBundle": false,
+  "_integrity": "sha512-XDTVXyQ2TR/9Qa66F1UYBSbf5f0IVFJFjiF8TXyIkoqrP6l7Wauj+UvJpinwCPk/6KoZtj29sh6ToGQiHdVIJA==",
+  "_location": "/@material/notched-outline",
+  "_phantomChildren": {},
+  "_requested": {
+    "type": "tag",
+    "registry": true,
+    "raw": "@material/notched-outline",
+    "name": "@material/notched-outline",
+    "escapedName": "@material%2fnotched-outline",
+    "scope": "@material",
+    "rawSpec": "",
+    "saveSpec": null,
+    "fetchSpec": "latest"
+  },
+  "_requiredBy": [
+    "#USER",
+    "/",
+    "/@material/textfield"
+  ],
+  "_resolved": "https://registry.npmjs.org/@material/notched-outline/-/notched-outline-0.38.0.tgz",
+  "_shasum": "75ae05a79cdd6a3761d8ddf3afd763c1450c22c8",
+  "_spec": "@material/notched-outline",
+  "_where": "C:\\Users\\jakch\\github\\tool-hub",
+  "bugs": {
+    "url": "https://github.com/material-components/material-components-web/issues"
+  },
+  "bundleDependencies": false,
+  "dependencies": {
+    "@material/animation": "^0.34.0",
+    "@material/base": "^0.35.0",
+    "@material/theme": "^0.38.0"
+  },
+  "deprecated": false,
+  "description": "The Material Components for the web notched-outline component",
+  "homepage": "https://github.com/material-components/material-components-web#readme",
+  "keywords": [
+    "material components",
+    "material design",
+    "notchedoutline",
+    "notched outline"
+  ],
+  "license": "Apache-2.0",
+  "main": "index.js",
+  "name": "@material/notched-outline",
+  "publishConfig": {
+    "access": "public"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/material-components/material-components-web.git"
+  },
+  "version": "0.38.0"
+}
diff --git a/node_modules/@material/shape/README.md b/node_modules/@material/shape/README.md
new file mode 100644
index 0000000..6ba696d
--- /dev/null
+++ b/node_modules/@material/shape/README.md
@@ -0,0 +1,107 @@
+<!--docs:
+title: "Shape"
+layout: detail
+section: components
+excerpt: "Shapes direct attention, identify components, communicate state, and express brand."
+path: /catalog/shape/
+-->
+
+# Shape
+
+<!--<div class="article__asset">
+  <a class="article__asset-link"
+     href="https://material-components-web.appspot.com/shape.html">
+    <img src="{{ site.rootpath }}/images/mdc_web_screenshots/shape.png" width="159" alt="Shape screenshot">
+  </a>
+</div>-->
+
+Shapes direct attention, identify components, communicate state, and express brand.
+
+Many MDC Web components include direct support for rounded corners; this package provides additional support for
+applying angled corners to unelevated surfaces.
+
+## Design
+
+<ul class="icon-list">
+  <li class="icon-list-item icon-list-item--link">
+    <a href="https://material-components-web.appspot.com/shape.html">Demo</a>
+  </li>
+</ul>
+
+## Installation
+
+```
+npm install @material/shape
+```
+
+## Basic Usage
+
+### HTML
+
+The markup for angled corners involves a container element, and one element per angled corner.
+
+The following example demonstrates angled corners applied to a MDC Button, but this technique may be applied to any
+unelevated component.
+
+```html
+<div class="mdc-shape-container my-shape-container">
+  <button class="mdc-button mdc-button--unelevated">Button</button>
+  <div class="mdc-shape-container__corner mdc-shape-container__corner--top-left"></div>
+  <div class="mdc-shape-container__corner mdc-shape-container__corner--top-right"></div>
+  <div class="mdc-shape-container__corner mdc-shape-container__corner--bottom-right"></div>
+  <div class="mdc-shape-container__corner mdc-shape-container__corner--bottom-left"></div>
+</div>
+```
+
+> **Note:** Each angled corner should have its own `<div>` element. Any corner that will not be cut (i.e. its size is 0)
+> does not need a dedicated element.
+
+### Styles
+
+```scss
+@import "@material/shape/mixins";
+
+.my-shape-container {
+  @include mdc-shape-angled-corner(#fff, 10px);
+}
+```
+
+## Variants
+
+### Outlined Angled Corners
+
+Outlined angled corners involve the same markup and styles as above, with the addition of including a mixin for outline:
+
+```scss
+@import "@material/shape/mixins";
+
+.my-shape-container {
+  @include mdc-shape-angled-corner(#fff, 10px);
+  @include mdc-shape-angled-corner-outline(2px, blue);
+}
+```
+
+## Style Customization
+
+### CSS Classes
+
+CSS Class | Description
+--- | ---
+`mdc-shape-container` | Mandatory. Parent element containing the component to be masked.
+`mdc-shape-container__corner` | Mandatory. Element for masking a specific corner; there may be up to 4.
+`mdc-shape-container__corner--bottom-left` | Element for masking the bottom left corner of the component.
+`mdc-shape-container__corner--bottom-right` | Element for masking the bottom right corner of the component.
+`mdc-shape-container__corner--top-left` | Element for masking the top left corner of the component.
+`mdc-shape-container__corner--top-right` | Element for masking the top right corner of the component.
+
+### Sass Mixins
+
+Mixin | Description
+--- | ---
+`mdc-shape-angled-corner($background-color, $top-left-size[, $top-right-size, $bottom-right-size, $bottom-left-size])` | Applies styles for masking angled corners, using the given background color and corner sizes. If fewer than 4 corner sizes are specified, the mixin automatically determines the other corners similarly to CSS `border-radius`.
+`mdc-shape-angled-corner-background($background-color)` | Sets the background color used to mask angled corners. Useful for styling a subset of components in a section with a different background color.
+`mdc-shape-angled-corner-outline($outline-width, $outline-color[, $outline-style])` | Applies outline styles to angled corners. `$outline-style` defaults to `solid`.
+
+> **Note:** When mentioned above, "background color" specifically refers to the color of the background behind the surface (_not_ the fill color of the surface). These mixins operate by masking the corners of the surface to match the background.
+
+> **Note:** These mixins should be included in the context of the container element (or an ancestor) in order to apply styles to the corner elements.
diff --git a/node_modules/@material/shape/_mixins.scss b/node_modules/@material/shape/_mixins.scss
new file mode 100644
index 0000000..13ec167
--- /dev/null
+++ b/node_modules/@material/shape/_mixins.scss
@@ -0,0 +1,58 @@
+//
+// Copyright 2018 Google Inc. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+// Sets 45-degree angle corners of a certain size (akin to border-radius but for flat corners).
+@mixin mdc-shape-angled-corner($background-color, $top-left-size, $top-right-size: $top-left-size, $bottom-right-size: $top-left-size, $bottom-left-size: $top-right-size) {
+  $corners: (top, left, $top-left-size),
+    (top, right, $top-right-size),
+    (bottom, right, $bottom-right-size),
+    (bottom, left, $bottom-left-size);
+
+  @each $y, $x, $size in $corners {
+    @if $size > 0 {
+      // Assume that the size passed represents the width/height rather than the diagonal.
+      // This makes it trivial e.g. to accomplish a horizontal arrow cap by specifying exactly half the shape's height.
+      // Unfortunately, Sass doesn't have built-in exponentiation, and node-sass custom functions seem to hang.
+      // (https://github.com/sass/node-sass/issues/857 may be related, but the workaround didn't seem to work.)
+      // Fortunately, if we assume 45 degree cutouts all the time, a^2 + b^2 = c^2 simplifies to a*sqrt(2).
+      $diagonal-length: $size * 1.4142135623730951;
+
+      .mdc-shape-container__corner--#{$y}-#{$x} {
+        #{$y}: -$diagonal-length / 2;
+        #{$x}: -$diagonal-length / 2;
+        width: $diagonal-length;
+        height: $diagonal-length;
+      }
+    }
+  }
+
+  @include mdc-shape-angled-corner-background($background-color);
+}
+
+// Sets the background color used for masking.
+// Exposed separately to allow overriding for some shapes within a page which happen to be over a different background.
+@mixin mdc-shape-angled-corner-background($background-color) {
+  .mdc-shape-container__corner::after {
+    background-color: $background-color;
+  }
+}
+
+@mixin mdc-shape-angled-corner-outline($outline-width, $outline-color, $outline-style: solid) {
+  .mdc-shape-container__corner::before {
+    top: $outline-width;
+    border-bottom: $outline-width $outline-style $outline-color;
+  }
+}
diff --git a/node_modules/@material/shape/dist/mdc.shape.css b/node_modules/@material/shape/dist/mdc.shape.css
new file mode 100644
index 0000000..7d0a24c
--- /dev/null
+++ b/node_modules/@material/shape/dist/mdc.shape.css
@@ -0,0 +1,39 @@
+/*!
+ Material Components for the Web
+ Copyright (c) 2018 Google Inc.
+ License: Apache-2.0
+*/
+.mdc-shape-container {
+  display: inline-block;
+  position: relative;
+  overflow: hidden; }
+
+.mdc-shape-container__corner {
+  position: absolute;
+  z-index: 1; }
+
+.mdc-shape-container__corner::before,
+.mdc-shape-container__corner::after {
+  position: absolute;
+  box-sizing: border-box;
+  width: 100%;
+  height: 100%;
+  content: ""; }
+
+.mdc-shape-container__corner--top-left {
+  -webkit-transform: rotate(-45deg);
+          transform: rotate(-45deg); }
+
+.mdc-shape-container__corner--top-right {
+  -webkit-transform: rotate(45deg);
+          transform: rotate(45deg); }
+
+.mdc-shape-container__corner--bottom-right {
+  -webkit-transform: rotate(135deg);
+          transform: rotate(135deg); }
+
+.mdc-shape-container__corner--bottom-left {
+  -webkit-transform: rotate(-135deg);
+          transform: rotate(-135deg); }
+
+/*# sourceMappingURL=mdc.shape.css.map*/
\ No newline at end of file
diff --git a/node_modules/@material/shape/dist/mdc.shape.min.css b/node_modules/@material/shape/dist/mdc.shape.min.css
new file mode 100644
index 0000000..6151fe0
--- /dev/null
+++ b/node_modules/@material/shape/dist/mdc.shape.min.css
@@ -0,0 +1,7 @@
+/*!
+ Material Components for the Web
+ Copyright (c) 2018 Google Inc.
+ License: Apache-2.0
+*/
+.mdc-shape-container{display:inline-block;position:relative;overflow:hidden}.mdc-shape-container__corner{position:absolute;z-index:1}.mdc-shape-container__corner:after,.mdc-shape-container__corner:before{position:absolute;box-sizing:border-box;width:100%;height:100%;content:""}.mdc-shape-container__corner--top-left{-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}.mdc-shape-container__corner--top-right{-webkit-transform:rotate(45deg);transform:rotate(45deg)}.mdc-shape-container__corner--bottom-right{-webkit-transform:rotate(135deg);transform:rotate(135deg)}.mdc-shape-container__corner--bottom-left{-webkit-transform:rotate(-135deg);transform:rotate(-135deg)}
+/*# sourceMappingURL=mdc.shape.min.css.map*/
\ No newline at end of file
diff --git a/node_modules/@material/shape/mdc-shape.scss b/node_modules/@material/shape/mdc-shape.scss
new file mode 100644
index 0000000..0d7f60b
--- /dev/null
+++ b/node_modules/@material/shape/mdc-shape.scss
@@ -0,0 +1,52 @@
+//
+// Copyright 2018 Google Inc. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+.mdc-shape-container {
+  display: inline-block;
+  position: relative;
+  overflow: hidden; // Prevent overflowed borders from encroaching on surrounding elements
+}
+
+.mdc-shape-container__corner {
+  position: absolute;
+  // IE and Edge require z-index set to 1 to properly mask ripple.
+  z-index: 1;
+}
+
+.mdc-shape-container__corner::before,
+.mdc-shape-container__corner::after {
+  position: absolute;
+  box-sizing: border-box;
+  width: 100%;
+  height: 100%;
+  content: "";
+}
+
+.mdc-shape-container__corner--top-left {
+  transform: rotate(-45deg);
+}
+
+.mdc-shape-container__corner--top-right {
+  transform: rotate(45deg);
+}
+
+.mdc-shape-container__corner--bottom-right {
+  transform: rotate(135deg);
+}
+
+.mdc-shape-container__corner--bottom-left {
+  transform: rotate(-135deg);
+}
diff --git a/node_modules/@material/shape/package.json b/node_modules/@material/shape/package.json
new file mode 100644
index 0000000..1455e5d
--- /dev/null
+++ b/node_modules/@material/shape/package.json
@@ -0,0 +1,49 @@
+{
+  "_from": "@material/shape",
+  "_id": "@material/shape@0.35.0",
+  "_inBundle": false,
+  "_integrity": "sha512-WMmGLWrqRymMn8gaPybDWRIx7zNurUmaUa/OoxB++HSiLdLZf8hdEffiWLgqc5u97eRpb4IRaIi/jzcPbWxiUw==",
+  "_location": "/@material/shape",
+  "_phantomChildren": {},
+  "_requested": {
+    "type": "tag",
+    "registry": true,
+    "raw": "@material/shape",
+    "name": "@material/shape",
+    "escapedName": "@material%2fshape",
+    "scope": "@material",
+    "rawSpec": "",
+    "saveSpec": null,
+    "fetchSpec": "latest"
+  },
+  "_requiredBy": [
+    "#USER",
+    "/"
+  ],
+  "_resolved": "https://registry.npmjs.org/@material/shape/-/shape-0.35.0.tgz",
+  "_shasum": "2bd20063cef04034f9e050a2d96027bb3f645d6f",
+  "_spec": "@material/shape",
+  "_where": "C:\\Users\\jakch\\github\\tool-hub",
+  "bugs": {
+    "url": "https://github.com/material-components/material-components-web/issues"
+  },
+  "bundleDependencies": false,
+  "deprecated": false,
+  "description": "Shape utilities for Material Components for the web",
+  "homepage": "https://github.com/material-components/material-components-web#readme",
+  "keywords": [
+    "material components",
+    "material design",
+    "shape"
+  ],
+  "license": "Apache-2.0",
+  "name": "@material/shape",
+  "publishConfig": {
+    "access": "public"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/material-components/material-components-web.git"
+  },
+  "version": "0.35.0"
+}
diff --git a/node_modules/@material/textfield/README.md b/node_modules/@material/textfield/README.md
new file mode 100644
index 0000000..5caf834
--- /dev/null
+++ b/node_modules/@material/textfield/README.md
@@ -0,0 +1,321 @@
+<!--docs:
+title: "Text Field"
+layout: detail
+section: components
+iconId: text_field
+path: /catalog/input-controls/text-field/
+-->
+
+## Important - Default Style Deprecation Notice
+
+The existing default text field style will be changed in an upcoming release. The Material spec indicates that
+the default style will be the filled variant (currently referred to as the box variant). This will become the  
+default style. Continuing to add the `mdc-text-field--box` class to the text field will
+result in no change. 
+
+# Text Field
+
+<!--<div class="article__asset">
+  <a class="article__asset-link"
+     href="https://material-components.github.io/material-components-web-catalog/#/component/text-field">
+    <img src="{{ site.rootpath }}/images/mdc_web_screenshots/textfields.png" width="240" alt="Text fields screenshot">
+  </a>
+</div>-->
+
+Text fields allow users to input, edit, and select text.
+
+## Design & API Documentation
+
+<ul class="icon-list">
+  <li class="icon-list-item icon-list-item--spec">
+    <a href="https://material.io/go/design-text-fields">Material Design guidelines: Text Fields</a>
+  </li>
+  <li class="icon-list-item icon-list-item--link">
+    <a href="https://material-components.github.io/material-components-web-catalog/#/component/text-field">Demo</a>
+  </li>
+</ul>
+
+## Installation
+
+```
+npm install @material/textfield
+```
+
+## Basic Usage
+
+### HTML Structure
+
+```html
+<div class="mdc-text-field">
+  <input type="text" id="my-text-field" class="mdc-text-field__input">
+  <label class="mdc-floating-label" for="my-text-field">Hint text</label>
+  <div class="mdc-line-ripple"></div>
+</div>
+```
+
+> NOTE: Text field supports `text`, `number`, and `password` input types (e.g., `<input type="password" class="mdc-text-field__input">`).
+>
+> Other input types (such as `date`) are not currently supported.
+
+> NOTE: For more details, see [MDC Line Ripple](../mdc-line-ripple/README.md)
+> and [MDC Floating Label](../mdc-floating-label/README.md).
+
+### Styles
+
+```scss
+@import "@material/textfield/mdc-text-field";
+```
+
+### JavaScript Instantiation
+
+```js
+import {MDCTextField} from '@material/textfield';
+
+const textField = new MDCTextField(document.querySelector('.mdc-text-field'));
+```
+
+> See [Importing the JS component](../../docs/importing-js.md) for more information on how to import JavaScript.
+
+## Variants
+
+### Full Width
+
+Full width text fields are useful for in-depth tasks or entering complex information.
+
+```html
+<div class="mdc-text-field mdc-text-field--fullwidth">
+  <input class="mdc-text-field__input"
+         type="text"
+         placeholder="Full-Width Text Field"
+         aria-label="Full-Width Text Field">
+</div>
+```
+
+> _NOTE_: Do not use `mdc-text-field--box` or `mdc-text-field--outlined` to style a full width text field.
+
+> _NOTE_: Do not use `mdc-floating-label` within `mdc-text-field--fullwidth`. Labels should not be
+included as part of the DOM structure of a full width text field.
+
+### Textarea
+
+```html
+<div class="mdc-text-field mdc-text-field--textarea">
+  <textarea id="textarea" class="mdc-text-field__input" rows="8" cols="40"></textarea>
+  <label for="textarea" class="mdc-floating-label">Textarea Label</label>
+</div>
+```
+
+### Outlined
+
+```html
+<div class="mdc-text-field mdc-text-field--outlined">
+  <input type="text" id="tf-outlined" class="mdc-text-field__input">
+  <label for="tf-outlined" class="mdc-floating-label">Your Name</label>
+  <div class="mdc-notched-outline">
+    <svg>
+      <path class="mdc-notched-outline__path"/>
+    </svg>
+  </div>
+  <div class="mdc-notched-outline__idle"></div>
+</div>
+```
+
+See [here](../mdc-notched-outline/) for more information on using the notched outline sub-component.
+
+> _NOTE_: Do not use `mdc-line-ripple` inside of `mdc-text-field` _if you plan on using `mdc-text-field--outlined`_. Line Ripple should not be included as part of the DOM structure of an outlined text field.
+
+### Disabled
+
+To disable the text field, add the `disabled` attribute to the `<input>` element and add the `mdc-text-field--disabled` class to the `mdc-text-field` element.
+
+```html
+<div class="mdc-text-field mdc-text-field--disabled">
+  <input type="text" id="disabled-text-field" class="mdc-text-field__input" disabled>
+  <label class="mdc-floating-label" for="disabled-text-field">Disabled text field</label>
+  <div class="mdc-line-ripple"></div>
+</div>
+```
+
+### Text Field with Helper Text
+
+The helper text provides supplemental information and/or validation messages to users. It appears on input field focus
+and disappears on input field blur by default, or it can be persistent.
+See [here](helper-text/) for more information on using helper text.
+
+### Text Field with Leading and Trailing Icons
+
+Leading and trailing icons can be added within the box or outlined variants of MDC Text Field as visual indicators as
+well as interaction targets. See [here](icon/) for more information on using icons.
+
+
+### HTML5 Validation
+
+`MDCTextFieldFoundation` provides validity styling by using the `:invalid` and `:required` attributes provided
+by HTML5's form validation API.
+
+```html
+<div class="mdc-text-field">
+  <input type="password" id="pw" class="mdc-text-field__input" required minlength=8>
+  <label for="pw" class="mdc-floating-label">Password</label>
+  <div class="mdc-line-ripple"></div>
+</div>
+```
+
+`MDCTextFieldFoundation` automatically appends an asterisk to the label text if the required attribute is set.
+
+### Pre-filled
+
+When dealing with JS-driven text fields that already have values, you'll want to ensure that you
+render `mdc-floating-label` with the `mdc-floating-label--float-above` modifier class, and `mdc-text-field` with the `mdc-text-field--upgraded` modifier class. This will
+ensure that the label moves out of the way of the text field's value and prevents a Flash Of
+Un-styled Content (**FOUC**).
+
+```html
+<div class="mdc-text-field mdc-text-field--upgraded">
+  <input type="text" id="pre-filled" class="mdc-text-field__input" value="Pre-filled value">
+  <label class="mdc-floating-label mdc-floating-label--float-above" for="pre-filled">
+    Label in correct place
+  </label>
+  <div class="mdc-line-ripple"></div>
+</div>
+```
+
+## Style Customization
+
+### CSS Classes
+
+CSS Class | Description
+--- | ---
+`mdc-text-field` | Mandatory.
+`mdc-text-field--upgraded` | Indicates the text field is upgraded, using JavaScript.
+`mdc-text-field--box` | Styles the text field as a box text field.
+`mdc-text-field--outlined` | Styles the text field as an outlined text field.
+`mdc-text-field--fullwidth` | Styles the text field as a full width text field.
+`mdc-text-field--textarea` | Indicates the text field is a `<textarea>`.
+`mdc-text-field--disabled` | Styles the text field as a disabled text field.
+`mdc-text-field--dense` | Styles the text field as a dense text field.
+`mdc-text-field--with-leading-icon` | Styles the text field as a text field with a leading icon.
+`mdc-text-field--with-trailing-icon` | Styles the text field as a text field with a trailing icon.
+`mdc-text-field--focused` | Styles the text field as a text field in focus.
+
+### Sass Mixins
+
+To customize the colors of any part of the text-field, use the following mixins. We recommend you apply
+these mixins within CSS selectors like `.foo-text-field:not(.mdc-text-field--focused)` to select your unfocused text fields,
+and `.foo-text-field.mdc-text-field--focused` to select your focused text-fields. To change the invalid state of your text fields,
+apply these mixins with CSS selectors such as `.foo-text-field.mdc-text-field--invalid`.
+
+> _NOTE_: the `mdc-line-ripple-color` mixin should be applied from the not focused class `foo-text-field:not(.mdc-text-field--focused)`).
+
+#### Mixins for Text Field Box
+
+Mixin | Description
+--- | ---
+`mdc-text-field-box-corner-radius($radius)` | Customizes the border radius for the text field box variant.
+`mdc-text-field-box-fill-color($color)` | Customizes the background color of the text field box.
+
+#### Mixins for Outlined Text Field
+
+Mixin | Description
+--- | ---
+`mdc-text-field-focused-outline-color($color)` | Customizes the outline border color when the text field is focused.
+`mdc-text-field-hover-outline-color($color)` | Customizes the outline border color when the text field is hovered.
+`mdc-text-field-outline-color($color)` | Customizes the border color of the outlined text field.
+`mdc-text-field-outline-corner-radius($radius)` | Sets the border radius of of the outlined text field variant.
+
+#### Mixins for Textarea
+
+Mixin | Description
+--- | ---
+`mdc-text-field-textarea-corner-radius($radius)` | Customizes the border radius for a `<textarea>` variant.
+`mdc-text-field-textarea-fill-color($color)` | Customizes the color of the background of the textarea.
+`mdc-text-field-textarea-stroke-color($color)` | Customizes the color of the border of the textarea.
+
+
+#### Mixins for Text Field Fullwidth
+
+Mixin | Description
+--- | ---
+`mdc-text-field-fullwidth-bottom-line-color($color)` | Customizes the fullwidth text field variant bottom line color.
+
+#### Other Mixins
+
+Mixin | Description
+--- | ---
+`mdc-text-field-bottom-line-color($color)` | Customizes the text field bottom line color except the outlined and textarea variants.
+`mdc-text-field-hover-bottom-line-color($color)` | Customizes the hover text field bottom line color except the outlined and textarea variants.
+`mdc-text-field-ink-color($color)` | Customizes the text entered into the text field.
+`mdc-text-field-label-color($color)` | Customizes the text color of the label.
+`mdc-text-field-line-ripple-color($color)` | Customizes the color of the default line ripple of the text field.
+`mdc-text-field-caret-color($color)` | Customizes the color of the cursor caret of the text field.
+
+## `MDCTextField` Properties and Methods
+
+Property | Value Type | Description
+--- | --- | ---
+`value` | String | Proxies to the foundation's `getValue`/`setValue` methods.
+`disabled` | Boolean | Proxies to the foundation's `isDisabled`/`setDisabled` methods.
+`valid` | Boolean | Proxies to the foundation's `isValid`/`setValid` methods.
+`required` | Boolean | Proxies to the foundation's `isRequired`/`setRequired` methods.
+`helperTextContent` | String | Proxies to the foundation's `setHelperTextContent` method when set.
+`ripple` | `MDCRipple` | The `MDCRipple` instance for the root element that `MDCTextField` initializes; this only applies to Text Field Box, and is `null` for other variants.
+
+Method Signature | Description
+--- | ---
+`layout() => void` | Adjusts the dimensions and positions for all sub-elements.
+
+## Usage Within Frameworks
+
+If you are using a JavaScript framework, such as React or Angular, you can create a Text Field for your framework. Depending on your needs, you can use the _Simple Approach: Wrapping MDC Web Vanilla Components_, or the _Advanced Approach: Using Foundations and Adapters_. Please follow the instructions [here](../../docs/integrating-into-frameworks.md).
+
+
+### `MDCTextFieldAdapter`
+
+Method Signature | Description
+--- | ---
+`addClass(className: string) => void` | Adds a class to the root element.
+`removeClass(className: string) => void` | Removes a class from the root element.
+`hasClass(className: string) => boolean` | Returns true if the root element contains the given class name.
+`registerTextFieldInteractionHandler(evtType: string, handler: EventListener) => void` | Registers an event handler on the root element for a given event.
+`deregisterTextFieldInteractionHandler(evtType: string, handler: EventListener) => void` | Deregisters an event handler on the root element for a given event.
+`registerInputInteractionHandler(evtType: string, handler: EventListener) => void` | Registers an event listener on the native input element for a given event.
+`deregisterInputInteractionHandler(evtType: string, handler: EventListener) => void` | Deregisters an event listener on the native input element for a given event.
+`registerValidationAttributeChangeHandler(handler: function(!Array<string>) => undefined) => !MutationObserver` | Registers a validation attribute change listener on the input element. Handler accepts list of attribute changes.
+`deregisterValidationAttributeChangeHandler(!MutationObserver) => void` | Disconnects a validation attribute observer on the input element.
+`getNativeInput() => {value: string, disabled: boolean, badInput: boolean, checkValidity: () => boolean}?` | Returns an object representing the native text input element, with a similar API shape.
+`isFocused() => boolean` | Returns whether the input is focused.
+`isRtl() => boolean` | Returns whether the direction of the root element is set to RTL.
+`hasOutline() => boolean` | Returns whether there is an outline element.
+`notchOutline(labelWidth: number, isRtl: boolean) => void` | Updates the notched outline path to open the notch and update the notch width for the label element.
+`closeOutline() => void` | Closes the notch in the notched outline element.
+
+#### `MDCTextFieldAdapter.getNativeInput()`
+
+Returns an object representing the native text input element, with a similar API shape. The object returned should include the `value`, `disabled` and `badInput` properties, as well as the `checkValidity()` function. We _never_ alter the value within our code, however we _do_ update the disabled property, so if you choose to duck-type the return value for this method in your implementation it's important to keep this in mind. Also note that this method can return null, which the foundation will handle gracefully.
+
+#### `MDCTextFieldAdapter.getIdleOutlineStyleValue(propertyName: string)`
+
+Returns the idle outline element's computed style value of the given css property `propertyName`. The vanilla implementation achieves this via `getComputedStyle(...).getPropertyValue(propertyName)`.
+
+### `MDCTextFieldFoundation`
+
+Method Signature | Description
+--- | ---
+`getValue() => string` | Returns the input's value.
+`setValue(value: string)` | Sets the input's value.
+`isValid() => boolean` | If a custom validity is set, returns that value. Otherwise, returns the result of native validity checks.
+`setValid(isValid: boolean)` | Sets custom validity. Once set, native validity checking is ignored.
+`isDisabled() => boolean` | Returns whether or not the input is disabled.
+`setDisabled(disabled: boolean) => void` | Updates the input's disabled state.
+`isRequired() => boolean` | Returns whether the input is required.
+`setRequired(isRequired: boolean)` | Sets whether the input is required.
+`handleTextFieldInteraction(evt: Event) => void` | Handles click and keydown events originating from inside the Text Field component.
+`handleValidationAttributeChange(attributesList: !Array<string>) => void` | Handles validation attribute changes.
+`activateFocus() => void` | Activates the focus state of the Text Field. Normally called in response to the input focus event.
+`deactivateFocus() => void` | Deactivates the focus state of the Text Field. Normally called in response to the input blur event.
+`setHelperTextContent(content: string) => void` | Sets the content of the helper text.
+`setIconAriaLabel(label: string) => void` | Sets the aria label of the icon.
+`setIconContent(content: string) => void` | Sets the text content of the icon.
+`notchOutline(openNotch: boolean) => void` | Opens/closes the notched outline.
+
+`MDCTextFieldFoundation` supports multiple optional sub-elements: helper text and icon. The foundations of these sub-elements must be passed in as constructor arguments to `MDCTextFieldFoundation`.
diff --git a/node_modules/@material/textfield/_functions.scss b/node_modules/@material/textfield/_functions.scss
new file mode 100644
index 0000000..8235651
--- /dev/null
+++ b/node_modules/@material/textfield/_functions.scss
@@ -0,0 +1,21 @@
+//
+// Copyright 2017 Google Inc. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+@import "@material/animation/variables";
+
+@function mdc-text-field-transition($property) {
+  @return #{$property} 180ms $mdc-animation-standard-curve-timing-function;
+}
diff --git a/node_modules/@material/textfield/_mixins.scss b/node_modules/@material/textfield/_mixins.scss
new file mode 100644
index 0000000..d72c2ce
--- /dev/null
+++ b/node_modules/@material/textfield/_mixins.scss
@@ -0,0 +1,571 @@
+//
+// Copyright 2017 Google Inc. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+@import "@material/floating-label/mixins";
+@import "@material/line-ripple/mixins";
+@import "@material/notched-outline/mixins";
+@import "@material/theme/mixins";
+@import "helper-text/mixins";
+@import "icon/mixins";
+@import "icon/variables";
+@import "./variables";
+
+@mixin mdc-text-field-box-corner-radius($radius) {
+  border-radius: $radius $radius 0 0;
+}
+
+@mixin mdc-text-field-textarea-corner-radius($radius) {
+  border-radius: $radius;
+
+  .mdc-floating-label {
+    // Bottom corners are square to prevent weird edge cases
+    // where text would be visible outside of the curve.
+    border-radius: $radius $radius 0 0;
+  }
+
+  .mdc-text-field__input {
+    // The input element is required to have 2 pixels shaved off
+    // of the radius of its parent. This prevents an ugly space of
+    // background between the two borders in each corner when the
+    // textarea is focused. This also means we need to guard against
+    // invalid output.
+    border-radius: max($radius - 2, 0);
+  }
+}
+
+@mixin mdc-text-field-ink-color($color) {
+  &:not(.mdc-text-field--disabled) {
+    @include mdc-text-field-ink-color_($color);
+  }
+}
+
+@mixin mdc-text-field-box-fill-color($color) {
+  &:not(.mdc-text-field--disabled) {
+    @include mdc-text-field-box-fill-color_($color);
+  }
+}
+
+@mixin mdc-text-field-textarea-stroke-color($color) {
+  &:not(.mdc-text-field--disabled) {
+    @include mdc-text-field-textarea-stroke-color_($color);
+  }
+}
+
+@mixin mdc-text-field-textarea-fill-color($color) {
+  &:not(.mdc-text-field--disabled) {
+    @include mdc-text-field-textarea-fill-color_($color);
+
+    // Automatically add label background color the same color as well to ensure
+    // the label can be seen if the input scrolls behind the label
+    .mdc-floating-label {
+      @include mdc-floating-label-fill-color($color);
+    }
+  }
+}
+
+@mixin mdc-text-field-fullwidth-bottom-line-color($color) {
+  &:not(.mdc-text-field--disabled) {
+    @include mdc-text-field-fullwidth-bottom-line-color_($color);
+  }
+}
+
+@mixin mdc-text-field-bottom-line-color($color) {
+  &:not(.mdc-text-field--disabled):not(.mdc-text-field--outlined):not(.mdc-text-field--textarea) {
+    @include mdc-text-field-bottom-line-color_($color);
+  }
+}
+
+@mixin mdc-text-field-hover-bottom-line-color($color) {
+  &:not(.mdc-text-field--disabled):not(.mdc-text-field--outlined):not(.mdc-text-field--textarea) {
+    @include mdc-text-field-hover-bottom-line-color_($color);
+  }
+}
+
+@mixin mdc-text-field-line-ripple-color($color) {
+  &:not(.mdc-text-field--disabled) {
+    @include mdc-text-field-line-ripple-color_($color);
+  }
+}
+
+@mixin mdc-text-field-label-color($color) {
+  &:not(.mdc-text-field--disabled) {
+    @include mdc-text-field-label-ink-color_($color);
+  }
+}
+
+@mixin mdc-text-field-outline-color($color) {
+  &:not(.mdc-text-field--disabled) {
+    @include mdc-text-field-outline-color_($color);
+  }
+}
+
+@mixin mdc-text-field-hover-outline-color($color) {
+  &:not(.mdc-text-field--disabled) {
+    @include mdc-text-field-hover-outline-color_($color);
+  }
+}
+
+@mixin mdc-text-field-focused-outline-color($color) {
+  &:not(.mdc-text-field--disabled) {
+    @include mdc-text-field-focused-outline-color_($color);
+  }
+}
+
+@mixin mdc-text-field-caret-color($color) {
+  .mdc-text-field__input {
+    @include mdc-theme-prop(caret-color, $color);
+  }
+}
+
+// Private mixins
+
+// Baseline
+
+@mixin mdc-text-field-disabled_ {
+  @include mdc-text-field-bottom-line-color_($mdc-text-field-disabled-border);
+  @include mdc-text-field-ink-color_($mdc-text-field-disabled-ink-color);
+  @include mdc-text-field-label-ink-color_($mdc-text-field-disabled-label-color);
+  @include mdc-text-field-helper-text-color_($mdc-text-field-disabled-helper-text-color);
+  @include mdc-text-field-icon-color_($mdc-text-field-disabled-icon);
+  @include mdc-text-field-fullwidth-bottom-line-color_($mdc-text-field-fullwidth-bottom-line-color);
+
+  pointer-events: none;
+
+  .mdc-text-field__input {
+    border-bottom: 1px dotted;
+  }
+
+  .mdc-floating-label {
+    cursor: default;
+  }
+}
+
+@mixin mdc-text-field-invalid_ {
+  @include mdc-text-field-bottom-line-color($mdc-text-field-error);
+  @include mdc-text-field-hover-bottom-line-color($mdc-text-field-error);
+  @include mdc-text-field-line-ripple-color($mdc-text-field-error);
+  @include mdc-text-field-label-color($mdc-text-field-error);
+  @include mdc-text-field-helper-text-validation-color($mdc-text-field-error);
+  @include mdc-text-field-caret-color($mdc-text-field-error);
+
+  &.mdc-text-field--with-trailing-icon {
+    @include mdc-text-field-icon-color($mdc-text-field-error);
+  }
+
+  + .mdc-text-field-helper-text--validation-msg {
+    opacity: 1;
+  }
+}
+
+@mixin mdc-text-field-focused_ {
+  @include mdc-text-field-label-color($mdc-text-field-focused-label-color);
+
+  @include mdc-required-text-field-label-asterisk_ {
+    color: $mdc-text-field-error;
+  }
+
+  + .mdc-text-field-helper-text:not(.mdc-text-field-helper-text--validation-msg) {
+    opacity: 1;
+  }
+}
+
+@mixin mdc-text-field-dense_ {
+  // NOTE: This is an eyeball'd approximation of what's in the mocks.
+  @include mdc-floating-label-float-position(110%, 0%, $mdc-text-field-dense-label-scale);
+
+  margin-top: 12px;
+  margin-bottom: 4px;
+
+  .mdc-floating-label {
+    font-size: .813rem;
+  }
+}
+
+@mixin mdc-required-text-field-label-asterisk_() {
+  .mdc-text-field__input:required + .mdc-floating-label::after {
+    @content;
+  }
+}
+
+@mixin mdc-text-field-outline-corner-radius_($radius) {
+  // NOTE: idle and notched state border radius mixins
+  // are broken into 2 different mixins, otherwise
+  // we would be overly specific (big no, no). The cause of
+  // this is because .mdc-notched-outline and .mdc-notched-outline__idle
+  // are siblings. .mdc-notched-outline__idle needs to be a child of
+  // .mdc-notched-outline in order to remedy this issue.
+  .mdc-notched-outline {
+    @include mdc-notched-outline-corner-radius($radius);
+  }
+
+  @include mdc-notched-outline-idle-corner-radius($radius);
+}
+
+// Outlined
+
+@mixin mdc-text-field-outlined-disabled_ {
+  @include mdc-text-field-ink-color_($mdc-text-field-placeholder);
+  @include mdc-text-field-outline-color_($mdc-text-field-outlined-disabled-border);
+
+  .mdc-text-field__input {
+    border-bottom: none;
+  }
+}
+
+@mixin mdc-text-field-outlined-invalid_ {
+  @include mdc-text-field-outline-color($mdc-text-field-error);
+  @include mdc-text-field-hover-outline-color($mdc-text-field-error);
+  @include mdc-text-field-focused-outline-color($mdc-text-field-error);
+}
+
+@mixin mdc-text-field-outlined-focused_ {
+  @include mdc-notched-outline-stroke-width(2px);
+}
+
+@mixin mdc-text-field-outlined-dense_ {
+  @include mdc-floating-label-float-position($mdc-text-field-outlined-dense-label-position-y, 0%, $mdc-text-field-dense-label-scale);
+  @include mdc-floating-label-shake-animation(text-field-outlined-dense);
+
+  height: 48px;
+
+  .mdc-text-field__input {
+    padding: 12px 12px 7px;
+  }
+
+  .mdc-floating-label {
+    bottom: 16px;
+  }
+
+  .mdc-text-field__icon {
+    top: 12px;
+  }
+}
+
+@mixin mdc-text-field-outlined_ {
+  @include mdc-text-field-outline-color($mdc-text-field-outlined-idle-border);
+  @include mdc-text-field-hover-outline-color($mdc-text-field-outlined-hover-border);
+  @include mdc-text-field-focused-outline-color(primary);
+  @include mdc-floating-label-float-position($mdc-text-field-outlined-label-position-y);
+  @include mdc-floating-label-shake-animation(text-field-outlined);
+  @include mdc-text-field-outline-corner-radius_($mdc-text-field-border-radius);
+
+  height: 56px;
+  border: none;
+
+  .mdc-text-field__input {
+    display: flex;
+    padding: 12px;
+    border: none !important;  // FF adds unwanted border in HC mode on windows.
+    background-color: transparent;
+    z-index: 1;
+  }
+
+  .mdc-floating-label {
+    @include mdc-rtl-reflexive-position(left, 16px);
+
+    position: absolute;
+    bottom: 20px;
+  }
+
+  .mdc-text-field__icon {
+    z-index: 2;
+  }
+}
+
+@mixin mdc-text-field-outline-color_($color) {
+  // NOTE: outlined version of text-field wants the "idle" and
+  // "notched" outline to have the same color. This covers two cases:
+  // 1) text field renders with NO value in the "idle" state
+  // 2) text field renders with a value in the "notched" state
+  @include mdc-notched-outline-idle-color($color);
+  @include mdc-notched-outline-color($color);
+}
+
+@mixin mdc-text-field-hover-outline-color_($color) {
+  &:not(.mdc-text-field--focused) {
+    .mdc-text-field__input:hover ~,
+    .mdc-text-field__icon:hover ~ {
+      @include mdc-notched-outline-idle-color($color);
+
+      // tldr; this doesn't break BEM:
+      // We need to wrap this mixin with the .mdc-notched-outline
+      // selector, because of the sibling selector '~'. The notched
+      // outline html structure has .mdc-notched-outline
+      // and .mdc-notched-outline__idle as siblings, while
+      // .mdc-notched-outline__path is a child of .mdc-notched-outline
+      .mdc-notched-outline {
+        @include mdc-notched-outline-color($color);
+      }
+    }
+  }
+}
+
+@mixin mdc-text-field-focused-outline-color_($color) {
+  &.mdc-text-field--focused {
+    @include mdc-notched-outline-color($color);
+  }
+}
+
+// Box
+
+@mixin mdc-text-field-box_ {
+  @include mdc-ripple-surface;
+  // Text Field Box intentionally omits press ripple, so each state needs to be specified individually
+  @include mdc-states-base-color($mdc-text-field-ink-color);
+  @include mdc-states-hover-opacity(mdc-states-opacity($mdc-text-field-ink-color, hover));
+  @include mdc-states-focus-opacity(mdc-states-opacity($mdc-text-field-ink-color, focus));
+  @include mdc-ripple-radius-bounded;
+  @include mdc-text-field-box-corner-radius($mdc-text-field-border-radius);
+  @include mdc-text-field-box-fill-color($mdc-text-field-box-background);
+  @include mdc-floating-label-float-position($mdc-text-field-box-label-position-y);
+  @include mdc-floating-label-shake-animation(text-field-box);
+
+  display: inline-flex;
+  position: relative;
+  height: 56px;
+  margin-top: 16px;
+  overflow: hidden;
+
+  .mdc-text-field__input {
+    align-self: flex-end;
+    box-sizing: border-box;
+    height: 100%;
+    padding: 20px 16px 0;
+  }
+
+  .mdc-floating-label {
+    @include mdc-rtl-reflexive-position(left, 16px);
+
+    position: absolute;
+    bottom: 20px;
+    width: calc(100% - #{$mdc-text-field-icon-padding});
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    pointer-events: none;
+    overflow: hidden;
+    // Force the label into its own layer to prevent to prevent visible layer promotion adjustments
+    // when the ripple is activated behind it.
+    will-change: transform;
+  }
+}
+
+@mixin mdc-text-field-box-disabled_ {
+  @include mdc-text-field-box-fill-color_($mdc-text-field-box-disabled-background);
+  @include mdc-text-field-bottom-line-color_($mdc-text-field-outlined-disabled-border);
+  @include mdc-text-field-label-color($mdc-text-field-disabled-label-color);
+
+  border-bottom: none;
+}
+
+@mixin mdc-text-field-box-dense_ {
+  @include mdc-floating-label-float-position($mdc-text-field-box-dense-label-position-y, 0%, $mdc-text-field-dense-label-scale);
+  @include mdc-floating-label-shake-animation(text-field-box-dense);
+
+  .mdc-text-field__input {
+    padding: 12px 12px 0;
+  }
+}
+
+// Icons
+
+@mixin mdc-text-field-with-leading-icon_ {
+  @include mdc-text-field-icon-horizontal-position_(left, $mdc-text-field-icon-position, $mdc-text-field-icon-padding);
+}
+
+@mixin mdc-text-field-dense-with-leading-icon_ {
+  @include mdc-text-field-icon-horizontal-position_(left, $mdc-text-field-dense-icon-position, $mdc-text-field-dense-icon-padding);
+}
+
+@mixin mdc-text-field-outlined-with-leading-icon_ {
+  @include mdc-floating-label-float-position($mdc-text-field-outlined-label-position-y, $mdc-text-field-outlined-with-leading-icon-label-position-x);
+  @include mdc-floating-label-shake-animation(text-field-outlined-leading-icon);
+
+  @include mdc-rtl {
+    @include mdc-floating-label-shake-animation(text-field-outlined-leading-icon-rtl);
+  }
+}
+
+@mixin mdc-text-field-outlined-dense-with-leading-icon_ {
+  @include mdc-floating-label-float-position($mdc-text-field-outlined-dense-label-position-y, $mdc-text-field-outlined-dense-with-leading-icon-label-position-x, $mdc-text-field-dense-label-scale);
+  @include mdc-floating-label-shake-animation(text-field-outlined-leading-icon-dense);
+
+  @include mdc-rtl {
+    @include mdc-floating-label-shake-animation(text-field-outlined-leading-icon-dense-rtl);
+  }
+}
+
+@mixin mdc-text-field-with-trailing-icon_ {
+  @include mdc-text-field-icon-horizontal-position_(right, $mdc-text-field-icon-position, $mdc-text-field-icon-padding);
+}
+
+@mixin mdc-text-field-dense-with-trailing-icon_ {
+  @include mdc-text-field-icon-horizontal-position_(right, $mdc-text-field-dense-icon-position, $mdc-text-field-dense-icon-padding);
+}
+
+// Full Width
+
+@mixin mdc-text-field-fullwidth_ {
+  width: 100%;
+
+  .mdc-text-field__input {
+    resize: vertical;
+  }
+
+  &:not(.mdc-text-field--textarea) {
+    display: block;
+    box-sizing: border-box;
+    height: 56px;
+    margin: 0;
+    border: none;
+    border-bottom: 1px solid;
+    outline: none;
+
+    .mdc-text-field__input {
+      width: 100%;
+      height: 100%;
+      padding: 0;
+      resize: none;
+      // Use !important here to override all other border treatments
+      border: none !important;
+    }
+  }
+}
+
+@mixin mdc-text-field-fullwidth-invalid_ {
+  @include mdc-text-field-fullwidth-bottom-line-color($mdc-text-field-error);
+}
+
+// Textarea
+
+@mixin mdc-text-field-textarea-disabled_ {
+  @include mdc-text-field-textarea-stroke-color_($mdc-text-field-disabled-border);
+  @include mdc-text-field-textarea-fill-color_($mdc-textarea-disabled-background);
+
+  border-style: solid;
+
+  .mdc-text-field__input {
+    border: 1px solid transparent;
+  }
+
+  .mdc-floating-label {
+    @include mdc-floating-label-fill-color($mdc-textarea-disabled-background);
+  }
+}
+
+@mixin mdc-text-field-textarea-invalid_ {
+  @include mdc-text-field-textarea-stroke-color($mdc-text-field-error);
+}
+
+@mixin mdc-text-field-textarea_ {
+  @include mdc-text-field-textarea-corner-radius($mdc-text-field-border-radius);
+  @include mdc-text-field-textarea-stroke-color($mdc-textarea-border);
+
+  // Translate above the top of the input, and compensate for the amount of offset needed
+  // to position the label within the bounds of the inset padding.
+  @include mdc-floating-label-float-position($mdc-text-field-textarea-label-position-y, 0%, $mdc-text-field-textarea-label-scale);
+  @include mdc-floating-label-shake-animation(textarea);
+
+  $padding-inset: 16px;
+  $label-offset-y: $padding-inset + 2;
+  $label-offset-x: $padding-inset;
+
+  display: flex;
+  width: fit-content;
+  height: initial;
+  transition: none;
+  border: 1px solid;
+  overflow: hidden;
+
+  .mdc-text-field__input {
+    height: auto;
+    margin: 0;
+    padding: $padding-inset;
+    padding-top: $padding-inset * 2;
+    border: 1px solid transparent;
+  }
+
+  .mdc-floating-label {
+    @include mdc-floating-label-fill-color($mdc-textarea-background);
+    @include mdc-rtl-reflexive(left, 1px, right, 0);
+    @include mdc-rtl-reflexive-property(margin, 8px, 0);
+
+    top: $label-offset-y;
+    bottom: auto;
+    margin-top: 2px;
+    padding: 12px 8px 8px 8px;
+    line-height: 1.15;
+    pointer-events: none;
+  }
+}
+
+// Customization
+
+@mixin mdc-text-field-ink-color_($color) {
+  .mdc-text-field__input {
+    @include mdc-theme-prop(color, $color);
+  }
+}
+
+@mixin mdc-text-field-box-fill-color_($color) {
+  @include mdc-theme-prop(background-color, $color);
+}
+
+@mixin mdc-text-field-textarea-stroke-color_($color) {
+  @include mdc-theme-prop(border-color, $color);
+
+  .mdc-text-field__input:focus {
+    @include mdc-theme-prop(border-color, $color);
+  }
+}
+
+@mixin mdc-text-field-textarea-fill-color_($color) {
+  @include mdc-theme-prop(background-color, $color);
+}
+
+@mixin mdc-text-field-fullwidth-bottom-line-color_($color) {
+  &:not(.mdc-text-field--textarea) {
+    @include mdc-theme-prop(border-bottom-color, $color);
+  }
+}
+
+@mixin mdc-text-field-bottom-line-color_($color) {
+  .mdc-text-field__input {
+    @include mdc-theme-prop(border-bottom-color, $color);
+  }
+}
+
+@mixin mdc-text-field-hover-bottom-line-color_($color) {
+  .mdc-text-field__input:hover {
+    @include mdc-theme-prop(border-bottom-color, $color);
+  }
+}
+
+@mixin mdc-text-field-line-ripple-color_($color) {
+  .mdc-line-ripple {
+    @include mdc-line-ripple-color($color);
+  }
+}
+
+@mixin mdc-text-field-label-ink-color_($color) {
+  .mdc-floating-label {
+    @include mdc-floating-label-ink-color($color);
+  }
+
+  // CSS-only version
+  .mdc-text-field__input::placeholder {
+    @include mdc-theme-prop(color, $color);
+  }
+}
diff --git a/node_modules/@material/textfield/_variables.scss b/node_modules/@material/textfield/_variables.scss
new file mode 100644
index 0000000..6bc1aeb
--- /dev/null
+++ b/node_modules/@material/textfield/_variables.scss
@@ -0,0 +1,59 @@
+//
+// Copyright 2017 Google Inc. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+$mdc-text-field-error: #b00020;
+$mdc-text-field-fullwidth-bottom-line-color: rgba(mdc-theme-prop-value(on-surface), .12);
+$mdc-text-field-disabled-border: rgba(#231f20, .26);
+$mdc-text-field-disabled-icon: rgba(mdc-theme-prop-value(on-surface), .3);
+$mdc-text-field-bottom-line-hover: rgba(mdc-theme-prop-value(on-surface), .87);
+$mdc-text-field-bottom-line-idle: rgba(mdc-theme-prop-value(on-surface), .42);
+$mdc-text-field-label: rgba(mdc-theme-prop-value(on-surface), .6);
+$mdc-text-field-placeholder: rgba(mdc-theme-prop-value(on-surface), .6);
+
+$mdc-text-field-ink-color: rgba(mdc-theme-prop-value(on-surface), .87);
+$mdc-text-field-helper-text-color: rgba(mdc-theme-prop-value(on-surface), .6);
+$mdc-text-field-icon-color: rgba(mdc-theme-prop-value(on-surface), .54);
+$mdc-text-field-focused-label-color: rgba(mdc-theme-prop-value(primary), .87);
+
+$mdc-text-field-disabled-label-color: rgba(mdc-theme-prop-value(on-surface), .37);
+$mdc-text-field-disabled-ink-color: rgba(mdc-theme-prop-value(on-surface), .37);
+$mdc-text-field-disabled-helper-text-color: rgba(mdc-theme-prop-value(on-surface), .37);
+
+$mdc-text-field-box-background: mix(mdc-theme-prop-value(on-surface), mdc-theme-prop-value(surface), 4%);
+$mdc-text-field-box-disabled-background: mix(mdc-theme-prop-value(on-surface), mdc-theme-prop-value(surface), 2%);
+$mdc-text-field-box-secondary-text: rgba(mdc-theme-prop-value(on-surface), .6);
+
+$mdc-text-field-outlined-idle-border: rgba(mdc-theme-prop-value(on-surface), .24);
+$mdc-text-field-outlined-disabled-border: rgba(mdc-theme-prop-value(on-surface), .06);
+$mdc-text-field-outlined-hover-border: rgba(mdc-theme-prop-value(on-surface), .87);
+
+$mdc-textarea-border: rgba(mdc-theme-prop-value(on-surface), .73);
+$mdc-textarea-background: rgba(mdc-theme-prop-value(surface), 1);
+// cannot be transparent because multiline textarea input
+// will make text unreadable
+$mdc-textarea-disabled-background: rgba(249, 249, 249, 1);
+
+$mdc-text-field-border-radius: 4px !default;
+
+$mdc-text-field-box-label-position-y: 50%;
+$mdc-text-field-box-dense-label-position-y: 70%;
+$mdc-text-field-dense-label-scale: .923;
+$mdc-text-field-outlined-label-position-y: 130%;
+$mdc-text-field-outlined-dense-label-position-y: 110%;
+$mdc-text-field-outlined-with-leading-icon-label-position-x: 32px;
+$mdc-text-field-outlined-dense-with-leading-icon-label-position-x: 21px;
+$mdc-text-field-textarea-label-position-y: 50%;
+// Note that the scale factor is an eyeballed approximation of what's shown in the mocks.
+$mdc-text-field-textarea-label-scale: .923;
diff --git a/node_modules/@material/textfield/adapter.js b/node_modules/@material/textfield/adapter.js
new file mode 100644
index 0000000..db24d8a
--- /dev/null
+++ b/node_modules/@material/textfield/adapter.js
@@ -0,0 +1,207 @@
+/**
+ * @license
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/* eslint-disable no-unused-vars */
+import MDCTextFieldHelperTextFoundation from './helper-text/foundation';
+import MDCTextFieldIconFoundation from './icon/foundation';
+
+/* eslint no-unused-vars: [2, {"args": "none"}] */
+
+/**
+ * @typedef {{
+ *   value: string,
+ *   disabled: boolean,
+ *   badInput: boolean,
+ *   validity: {
+ *     badInput: boolean,
+ *     valid: boolean,
+ *   },
+ * }}
+ */
+let NativeInputType;
+
+/**
+ * @typedef {{
+ *   helperText: (!MDCTextFieldHelperTextFoundation|undefined),
+ *   icon: (!MDCTextFieldIconFoundation|undefined),
+ * }}
+ */
+let FoundationMapType;
+
+/**
+ * Adapter for MDC Text Field.
+ *
+ * Defines the shape of the adapter expected by the foundation. Implement this
+ * adapter to integrate the Text Field into your framework. See
+ * https://github.com/material-components/material-components-web/blob/master/docs/authoring-components.md
+ * for more information.
+ *
+ * @record
+ */
+class MDCTextFieldAdapter {
+  /**
+   * Adds a class to the root Element.
+   * @param {string} className
+   */
+  addClass(className) {}
+
+  /**
+   * Removes a class from the root Element.
+   * @param {string} className
+   */
+  removeClass(className) {}
+
+  /**
+   * Returns true if the root element contains the given class name.
+   * @param {string} className
+   * @return {boolean}
+   */
+  hasClass(className) {}
+
+  /**
+   * Registers an event handler on the root element for a given event.
+   * @param {string} type
+   * @param {function(!Event): undefined} handler
+   */
+  registerTextFieldInteractionHandler(type, handler) {}
+
+  /**
+   * Deregisters an event handler on the root element for a given event.
+   * @param {string} type
+   * @param {function(!Event): undefined} handler
+   */
+  deregisterTextFieldInteractionHandler(type, handler) {}
+
+  /**
+   * Registers an event listener on the native input element for a given event.
+   * @param {string} evtType
+   * @param {function(!Event): undefined} handler
+   */
+  registerInputInteractionHandler(evtType, handler) {}
+
+  /**
+   * Deregisters an event listener on the native input element for a given event.
+   * @param {string} evtType
+   * @param {function(!Event): undefined} handler
+   */
+  deregisterInputInteractionHandler(evtType, handler) {}
+
+  /**
+   * Registers a validation attribute change listener on the input element.
+   * Handler accepts list of attribute names.
+   * @param {function(!Array<string>): undefined} handler
+   * @return {!MutationObserver}
+   */
+  registerValidationAttributeChangeHandler(handler) {}
+
+  /**
+   * Disconnects a validation attribute observer on the input element.
+   * @param {!MutationObserver} observer
+   */
+  deregisterValidationAttributeChangeHandler(observer) {}
+
+  /**
+   * Returns an object representing the native text input element, with a
+   * similar API shape. The object returned should include the value, disabled
+   * and badInput properties, as well as the checkValidity() function. We never
+   * alter the value within our code, however we do update the disabled
+   * property, so if you choose to duck-type the return value for this method
+   * in your implementation it's important to keep this in mind. Also note that
+   * this method can return null, which the foundation will handle gracefully.
+   * @return {?Element|?NativeInputType}
+   */
+  getNativeInput() {}
+
+  /**
+   * Returns true if the textfield is focused.
+   * We achieve this via `document.activeElement === this.root_`.
+   * @return {boolean}
+   */
+  isFocused() {}
+
+  /**
+   * Returns true if the direction of the root element is set to RTL.
+   * @return {boolean}
+   */
+  isRtl() {}
+
+  /**
+   * Activates the line ripple.
+   */
+  activateLineRipple() {}
+
+  /**
+   * Deactivates the line ripple.
+   */
+  deactivateLineRipple() {}
+
+  /**
+   * Sets the transform origin of the line ripple.
+   * @param {number} normalizedX
+   */
+  setLineRippleTransformOrigin(normalizedX) {}
+
+  /**
+   * Only implement if label exists.
+   * Shakes label if shouldShake is true.
+   * @param {boolean} shouldShake
+   */
+  shakeLabel(shouldShake) {}
+
+  /**
+   * Only implement if label exists.
+   * Floats the label above the input element if shouldFloat is true.
+   * @param {boolean} shouldFloat
+   */
+  floatLabel(shouldFloat) {}
+
+  /**
+   * Returns true if label element exists, false if it doesn't.
+   * @return {boolean}
+   */
+  hasLabel() {}
+
+  /**
+   * Only implement if label exists.
+   * Returns width of label in pixels.
+   * @return {number}
+   */
+  getLabelWidth() {}
+
+  /**
+   * Returns true if outline element exists, false if it doesn't.
+   * @return {boolean}
+   */
+  hasOutline() {}
+
+  /**
+   * Only implement if outline element exists.
+   * Updates SVG Path and outline element based on the
+   * label element width and RTL context.
+   * @param {number} labelWidth
+   * @param {boolean=} isRtl
+   */
+  notchOutline(labelWidth, isRtl) {}
+
+  /**
+   * Only implement if outline element exists.
+   * Closes notch in outline element.
+   */
+  closeOutline() {}
+}
+
+export {MDCTextFieldAdapter, NativeInputType, FoundationMapType};
diff --git a/node_modules/@material/textfield/constants.js b/node_modules/@material/textfield/constants.js
new file mode 100644
index 0000000..9173879
--- /dev/null
+++ b/node_modules/@material/textfield/constants.js
@@ -0,0 +1,52 @@
+/**
+ * @license
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/** @enum {string} */
+const strings = {
+  ARIA_CONTROLS: 'aria-controls',
+  INPUT_SELECTOR: '.mdc-text-field__input',
+  LABEL_SELECTOR: '.mdc-floating-label',
+  ICON_SELECTOR: '.mdc-text-field__icon',
+  OUTLINE_SELECTOR: '.mdc-notched-outline',
+  LINE_RIPPLE_SELECTOR: '.mdc-line-ripple',
+};
+
+/** @enum {string} */
+const cssClasses = {
+  ROOT: 'mdc-text-field',
+  UPGRADED: 'mdc-text-field--upgraded',
+  DISABLED: 'mdc-text-field--disabled',
+  DENSE: 'mdc-text-field--dense',
+  FOCUSED: 'mdc-text-field--focused',
+  INVALID: 'mdc-text-field--invalid',
+  BOX: 'mdc-text-field--box',
+  OUTLINED: 'mdc-text-field--outlined',
+};
+
+/** @enum {number} */
+const numbers = {
+  LABEL_SCALE: 0.75,
+  DENSE_LABEL_SCALE: 0.923,
+};
+
+// whitelist based off of https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/HTML5/Constraint_validation
+// under section: `Validation-related attributes`
+const VALIDATION_ATTR_WHITELIST = [
+  'pattern', 'min', 'max', 'required', 'step', 'minlength', 'maxlength',
+];
+
+export {cssClasses, strings, numbers, VALIDATION_ATTR_WHITELIST};
diff --git a/node_modules/@material/textfield/dist/mdc.textfield.css b/node_modules/@material/textfield/dist/mdc.textfield.css
new file mode 100644
index 0000000..7e49883
--- /dev/null
+++ b/node_modules/@material/textfield/dist/mdc.textfield.css
@@ -0,0 +1,1221 @@
+/*!
+ Material Components for the Web
+ Copyright (c) 2018 Google Inc.
+ License: Apache-2.0
+*/
+.mdc-floating-label {
+  font-family: Roboto, sans-serif;
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-font-smoothing: antialiased;
+  font-size: 1rem;
+  line-height: 1.75rem;
+  font-weight: 400;
+  letter-spacing: 0.00937em;
+  text-decoration: inherit;
+  text-transform: inherit;
+  position: absolute;
+  bottom: 8px;
+  left: 0;
+  -webkit-transform-origin: left top;
+          transform-origin: left top;
+  transition: color 150ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 150ms cubic-bezier(0.4, 0, 0.2, 1);
+  transition: transform 150ms cubic-bezier(0.4, 0, 0.2, 1), color 150ms cubic-bezier(0.4, 0, 0.2, 1);
+  transition: transform 150ms cubic-bezier(0.4, 0, 0.2, 1), color 150ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 150ms cubic-bezier(0.4, 0, 0.2, 1);
+  line-height: 1.15rem;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  cursor: text;
+  overflow: hidden;
+  will-change: transform; }
+  [dir="rtl"] .mdc-floating-label, .mdc-floating-label[dir="rtl"] {
+    /* @noflip */
+    right: 0;
+    /* @noflip */
+    left: auto;
+    /* @noflip */
+    -webkit-transform-origin: right top;
+            transform-origin: right top; }
+
+.mdc-floating-label--float-above {
+  cursor: auto; }
+
+.mdc-floating-label--float-above {
+  -webkit-transform: translateY(-100%) scale(0.75);
+          transform: translateY(-100%) scale(0.75); }
+
+.mdc-floating-label--shake {
+  -webkit-animation: mdc-floating-label-shake-float-above-standard 250ms 1;
+          animation: mdc-floating-label-shake-float-above-standard 250ms 1; }
+
+@-webkit-keyframes mdc-floating-label-shake-float-above-standard {
+  0% {
+    -webkit-transform: translateX(calc(0 - 0%)) translateY(-100%) scale(0.75);
+            transform: translateX(calc(0 - 0%)) translateY(-100%) scale(0.75); }
+  33% {
+    -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582);
+            animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582);
+    -webkit-transform: translateX(calc(4% - 0%)) translateY(-100%) scale(0.75);
+            transform: translateX(calc(4% - 0%)) translateY(-100%) scale(0.75); }
+  66% {
+    -webkit-animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);
+            animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);
+    -webkit-transform: translateX(calc(-4% - 0%)) translateY(-100%) scale(0.75);
+            transform: translateX(calc(-4% - 0%)) translateY(-100%) scale(0.75); }
+  100% {
+    -webkit-transform: translateX(calc(0 - 0%)) translateY(-100%) scale(0.75);
+            transform: translateX(calc(0 - 0%)) translateY(-100%) scale(0.75); } }
+
+@keyframes mdc-floating-label-shake-float-above-standard {
+  0% {
+    -webkit-transform: translateX(calc(0 - 0%)) translateY(-100%) scale(0.75);
+            transform: translateX(calc(0 - 0%)) translateY(-100%) scale(0.75); }
+  33% {
+    -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582);
+            animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582);
+    -webkit-transform: translateX(calc(4% - 0%)) translateY(-100%) scale(0.75);
+            transform: translateX(calc(4% - 0%)) translateY(-100%) scale(0.75); }
+  66% {
+    -webkit-animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);
+            animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);
+    -webkit-transform: translateX(calc(-4% - 0%)) translateY(-100%) scale(0.75);
+            transform: translateX(calc(-4% - 0%)) translateY(-100%) scale(0.75); }
+  100% {
+    -webkit-transform: translateX(calc(0 - 0%)) translateY(-100%) scale(0.75);
+            transform: translateX(calc(0 - 0%)) translateY(-100%) scale(0.75); } }
+
+.mdc-line-ripple {
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  width: 100%;
+  height: 2px;
+  -webkit-transform: scaleX(0);
+          transform: scaleX(0);
+  transition: opacity 180ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 180ms cubic-bezier(0.4, 0, 0.2, 1);
+  transition: transform 180ms cubic-bezier(0.4, 0, 0.2, 1), opacity 180ms cubic-bezier(0.4, 0, 0.2, 1);
+  transition: transform 180ms cubic-bezier(0.4, 0, 0.2, 1), opacity 180ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 180ms cubic-bezier(0.4, 0, 0.2, 1);
+  opacity: 0;
+  z-index: 2; }
+
+.mdc-line-ripple--active {
+  -webkit-transform: scaleX(1);
+          transform: scaleX(1);
+  opacity: 1; }
+
+.mdc-line-ripple--deactivating {
+  opacity: 0; }
+
+.mdc-notched-outline {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: calc(100% - 1px);
+  height: calc(100% - 2px);
+  transition: opacity 150ms cubic-bezier(0.4, 0, 0.2, 1);
+  opacity: 0;
+  overflow: hidden; }
+  .mdc-notched-outline svg {
+    position: absolute;
+    width: 100%;
+    height: 100%; }
+
+.mdc-notched-outline__idle {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: calc(100% - 4px);
+  height: calc(100% - 4px);
+  transition: opacity 150ms cubic-bezier(0.4, 0, 0.2, 1), border-color 150ms cubic-bezier(0.4, 0, 0.2, 1);
+  border: 1px solid;
+  opacity: 1; }
+
+.mdc-notched-outline__path {
+  stroke-width: 1px;
+  transition: stroke 150ms cubic-bezier(0.4, 0, 0.2, 1), stroke-width 150ms cubic-bezier(0.4, 0, 0.2, 1);
+  fill: transparent; }
+
+.mdc-notched-outline--notched {
+  opacity: 1; }
+
+.mdc-notched-outline--notched ~ .mdc-notched-outline__idle {
+  opacity: 0; }
+
+@-webkit-keyframes mdc-ripple-fg-radius-in {
+  from {
+    -webkit-animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+            animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+            transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1); }
+  to {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); } }
+
+@keyframes mdc-ripple-fg-radius-in {
+  from {
+    -webkit-animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+            animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+            transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1); }
+  to {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); } }
+
+@-webkit-keyframes mdc-ripple-fg-opacity-in {
+  from {
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear;
+    opacity: 0; }
+  to {
+    opacity: var(--mdc-ripple-fg-opacity, 0); } }
+
+@keyframes mdc-ripple-fg-opacity-in {
+  from {
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear;
+    opacity: 0; }
+  to {
+    opacity: var(--mdc-ripple-fg-opacity, 0); } }
+
+@-webkit-keyframes mdc-ripple-fg-opacity-out {
+  from {
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear;
+    opacity: var(--mdc-ripple-fg-opacity, 0); }
+  to {
+    opacity: 0; } }
+
+@keyframes mdc-ripple-fg-opacity-out {
+  from {
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear;
+    opacity: var(--mdc-ripple-fg-opacity, 0); }
+  to {
+    opacity: 0; } }
+
+.mdc-ripple-surface--test-edge-var-bug {
+  --mdc-ripple-surface-test-edge-var: 1px solid #000;
+  visibility: hidden; }
+  .mdc-ripple-surface--test-edge-var-bug::before {
+    border: var(--mdc-ripple-surface-test-edge-var); }
+
+.mdc-text-field-helper-text {
+  font-family: Roboto, sans-serif;
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-font-smoothing: antialiased;
+  font-size: 0.75rem;
+  line-height: 1.25rem;
+  font-weight: 400;
+  letter-spacing: 0.03333em;
+  text-decoration: inherit;
+  text-transform: inherit;
+  margin: 0;
+  transition: opacity 180ms cubic-bezier(0.4, 0, 0.2, 1);
+  opacity: 0;
+  will-change: opacity; }
+  .mdc-text-field + .mdc-text-field-helper-text {
+    margin-bottom: 8px; }
+
+.mdc-text-field-helper-text--persistent {
+  transition: none;
+  opacity: 1;
+  will-change: initial; }
+
+.mdc-text-field--with-leading-icon .mdc-text-field__icon,
+.mdc-text-field--with-trailing-icon .mdc-text-field__icon {
+  position: absolute;
+  bottom: 16px;
+  cursor: pointer; }
+
+.mdc-text-field__icon:not([tabindex]),
+.mdc-text-field__icon[tabindex="-1"] {
+  cursor: default;
+  pointer-events: none; }
+
+.mdc-text-field {
+  display: inline-block;
+  position: relative;
+  margin-bottom: 8px;
+  will-change: opacity, transform, color; }
+  .mdc-text-field:not(.mdc-text-field--disabled):not(.mdc-text-field--outlined):not(.mdc-text-field--textarea) .mdc-text-field__input {
+    border-bottom-color: rgba(0, 0, 0, 0.42); }
+  .mdc-text-field:not(.mdc-text-field--disabled):not(.mdc-text-field--outlined):not(.mdc-text-field--textarea) .mdc-text-field__input:hover {
+    border-bottom-color: rgba(0, 0, 0, 0.87); }
+  .mdc-text-field .mdc-line-ripple {
+    background-color: #6200ee;
+    /* @alternate */
+    background-color: var(--mdc-theme-primary, #6200ee); }
+  .mdc-text-field:not(.mdc-text-field--disabled) .mdc-text-field__input {
+    color: rgba(0, 0, 0, 0.87); }
+  .mdc-text-field:not(.mdc-text-field--disabled) .mdc-floating-label {
+    color: rgba(0, 0, 0, 0.6); }
+  .mdc-text-field:not(.mdc-text-field--disabled) .mdc-text-field__input::-webkit-input-placeholder {
+    color: rgba(0, 0, 0, 0.6); }
+  .mdc-text-field:not(.mdc-text-field--disabled) .mdc-text-field__input:-ms-input-placeholder {
+    color: rgba(0, 0, 0, 0.6); }
+  .mdc-text-field:not(.mdc-text-field--disabled) .mdc-text-field__input::-ms-input-placeholder {
+    color: rgba(0, 0, 0, 0.6); }
+  .mdc-text-field:not(.mdc-text-field--disabled) .mdc-text-field__input::placeholder {
+    color: rgba(0, 0, 0, 0.6); }
+  .mdc-text-field:not(.mdc-text-field--disabled) + .mdc-text-field-helper-text {
+    color: rgba(0, 0, 0, 0.6); }
+  .mdc-text-field:not(.mdc-text-field--disabled):not(.mdc-text-field--textarea) {
+    border-bottom-color: rgba(0, 0, 0, 0.12); }
+  .mdc-text-field:not(.mdc-text-field--disabled) .mdc-text-field__icon {
+    color: rgba(0, 0, 0, 0.54); }
+  .mdc-text-field .mdc-text-field__input {
+    caret-color: #6200ee;
+    /* @alternate */
+    caret-color: var(--mdc-theme-primary, #6200ee); }
+
+.mdc-text-field__input {
+  font-family: Roboto, sans-serif;
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-font-smoothing: antialiased;
+  font-size: 1rem;
+  line-height: 1.75rem;
+  font-weight: 400;
+  letter-spacing: 0.00937em;
+  text-decoration: inherit;
+  text-transform: inherit;
+  width: 100%;
+  height: 30px;
+  padding: 20px 0 1px;
+  transition: opacity 180ms cubic-bezier(0.4, 0, 0.2, 1);
+  border: none;
+  border-bottom: 1px solid;
+  border-radius: 0;
+  background: none;
+  -webkit-appearance: none;
+     -moz-appearance: none;
+          appearance: none; }
+  .mdc-text-field__input::-webkit-input-placeholder {
+    transition: color 180ms cubic-bezier(0.4, 0, 0.2, 1);
+    opacity: 1; }
+  .mdc-text-field__input:-ms-input-placeholder {
+    transition: color 180ms cubic-bezier(0.4, 0, 0.2, 1);
+    opacity: 1; }
+  .mdc-text-field__input::-ms-input-placeholder {
+    transition: color 180ms cubic-bezier(0.4, 0, 0.2, 1);
+    opacity: 1; }
+  .mdc-text-field__input::placeholder {
+    transition: color 180ms cubic-bezier(0.4, 0, 0.2, 1);
+    opacity: 1; }
+  .mdc-text-field__input:focus {
+    outline: none; }
+  .mdc-text-field__input:invalid {
+    box-shadow: none; }
+  .mdc-text-field__input:-webkit-autofill + .mdc-floating-label {
+    -webkit-transform: translateY(-100%) scale(0.75);
+            transform: translateY(-100%) scale(0.75);
+    cursor: auto; }
+
+.mdc-text-field--outlined {
+  height: 56px;
+  border: none; }
+  .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-notched-outline__idle {
+    border-color: rgba(0, 0, 0, 0.24); }
+  .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-notched-outline__path {
+    stroke: rgba(0, 0, 0, 0.24); }
+  .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused) .mdc-text-field__input:hover ~ .mdc-notched-outline__idle,
+  .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused) .mdc-text-field__icon:hover ~ .mdc-notched-outline__idle {
+    border-color: rgba(0, 0, 0, 0.87); }
+  .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused) .mdc-text-field__input:hover ~ .mdc-notched-outline .mdc-notched-outline__path,
+  .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused) .mdc-text-field__icon:hover ~ .mdc-notched-outline .mdc-notched-outline__path {
+    stroke: rgba(0, 0, 0, 0.87); }
+  .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mdc-notched-outline__path {
+    stroke: #6200ee;
+    /* @alternate */
+    stroke: var(--mdc-theme-primary, #6200ee); }
+  .mdc-text-field--outlined .mdc-floating-label--float-above {
+    -webkit-transform: translateY(-130%) scale(0.75);
+            transform: translateY(-130%) scale(0.75); }
+  .mdc-text-field--outlined .mdc-floating-label--shake {
+    -webkit-animation: mdc-floating-label-shake-float-above-text-field-outlined 250ms 1;
+            animation: mdc-floating-label-shake-float-above-text-field-outlined 250ms 1; }
+  .mdc-text-field--outlined .mdc-notched-outline {
+    border-radius: 4px; }
+  .mdc-text-field--outlined .mdc-notched-outline__idle {
+    border-radius: 4px; }
+  .mdc-text-field--outlined .mdc-text-field__input {
+    display: flex;
+    padding: 12px;
+    border: none !important;
+    background-color: transparent;
+    z-index: 1; }
+  .mdc-text-field--outlined .mdc-floating-label {
+    /* @noflip */
+    left: 16px;
+    /* @noflip */
+    right: initial;
+    position: absolute;
+    bottom: 20px; }
+    [dir="rtl"] .mdc-text-field--outlined .mdc-floating-label, .mdc-text-field--outlined .mdc-floating-label[dir="rtl"] {
+      /* @noflip */
+      left: initial;
+      /* @noflip */
+      right: 16px; }
+  .mdc-text-field--outlined .mdc-text-field__icon {
+    z-index: 2; }
+
+.mdc-text-field--outlined.mdc-text-field--focused .mdc-notched-outline__path {
+  stroke-width: 2px; }
+
+.mdc-text-field--outlined.mdc-text-field--disabled .mdc-text-field__input {
+  color: rgba(0, 0, 0, 0.6); }
+
+.mdc-text-field--outlined.mdc-text-field--disabled .mdc-notched-outline__idle {
+  border-color: rgba(0, 0, 0, 0.06); }
+
+.mdc-text-field--outlined.mdc-text-field--disabled .mdc-notched-outline__path {
+  stroke: rgba(0, 0, 0, 0.06); }
+
+.mdc-text-field--outlined.mdc-text-field--disabled .mdc-text-field__input {
+  border-bottom: none; }
+
+.mdc-text-field--outlined.mdc-text-field--dense {
+  height: 48px; }
+  .mdc-text-field--outlined.mdc-text-field--dense .mdc-floating-label--float-above {
+    -webkit-transform: translateY(-110%) scale(0.923);
+            transform: translateY(-110%) scale(0.923); }
+  .mdc-text-field--outlined.mdc-text-field--dense .mdc-floating-label--shake {
+    -webkit-animation: mdc-floating-label-shake-float-above-text-field-outlined-dense 250ms 1;
+            animation: mdc-floating-label-shake-float-above-text-field-outlined-dense 250ms 1; }
+  .mdc-text-field--outlined.mdc-text-field--dense .mdc-text-field__input {
+    padding: 12px 12px 7px; }
+  .mdc-text-field--outlined.mdc-text-field--dense .mdc-floating-label {
+    bottom: 16px; }
+  .mdc-text-field--outlined.mdc-text-field--dense .mdc-text-field__icon {
+    top: 12px; }
+
+.mdc-text-field--box {
+  --mdc-ripple-fg-size: 0;
+  --mdc-ripple-left: 0;
+  --mdc-ripple-top: 0;
+  --mdc-ripple-fg-scale: 1;
+  --mdc-ripple-fg-translate-end: 0;
+  --mdc-ripple-fg-translate-start: 0;
+  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
+  will-change: transform, opacity;
+  border-radius: 4px 4px 0 0;
+  display: inline-flex;
+  position: relative;
+  height: 56px;
+  margin-top: 16px;
+  overflow: hidden; }
+  .mdc-text-field--box::before, .mdc-text-field--box::after {
+    position: absolute;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+  .mdc-text-field--box::before {
+    transition: opacity 15ms linear;
+    z-index: 1; }
+  .mdc-text-field--box.mdc-ripple-upgraded::before {
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 1));
+            transform: scale(var(--mdc-ripple-fg-scale, 1)); }
+  .mdc-text-field--box.mdc-ripple-upgraded::after {
+    top: 0;
+    /* @noflip */
+    left: 0;
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-text-field--box.mdc-ripple-upgraded--unbounded::after {
+    top: var(--mdc-ripple-top, 0);
+    /* @noflip */
+    left: var(--mdc-ripple-left, 0); }
+  .mdc-text-field--box.mdc-ripple-upgraded--foreground-activation::after {
+    -webkit-animation: 225ms mdc-ripple-fg-radius-in forwards, 75ms mdc-ripple-fg-opacity-in forwards;
+            animation: 225ms mdc-ripple-fg-radius-in forwards, 75ms mdc-ripple-fg-opacity-in forwards; }
+  .mdc-text-field--box.mdc-ripple-upgraded--foreground-deactivation::after {
+    -webkit-animation: 150ms mdc-ripple-fg-opacity-out;
+            animation: 150ms mdc-ripple-fg-opacity-out;
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); }
+  .mdc-text-field--box::before, .mdc-text-field--box::after {
+    background-color: rgba(0, 0, 0, 0.87); }
+  .mdc-text-field--box:hover::before {
+    opacity: 0.04; }
+  .mdc-text-field--box:not(.mdc-ripple-upgraded):focus::before, .mdc-text-field--box.mdc-ripple-upgraded--background-focused::before {
+    transition-duration: 75ms;
+    opacity: 0.12; }
+  .mdc-text-field--box::before, .mdc-text-field--box::after {
+    top: calc(50% - 100%);
+    /* @noflip */
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%; }
+  .mdc-text-field--box.mdc-ripple-upgraded::after {
+    width: var(--mdc-ripple-fg-size, 100%);
+    height: var(--mdc-ripple-fg-size, 100%); }
+  .mdc-text-field--box:not(.mdc-text-field--disabled) {
+    background-color: whitesmoke; }
+  .mdc-text-field--box .mdc-floating-label--float-above {
+    -webkit-transform: translateY(-50%) scale(0.75);
+            transform: translateY(-50%) scale(0.75); }
+  .mdc-text-field--box .mdc-floating-label--shake {
+    -webkit-animation: mdc-floating-label-shake-float-above-text-field-box 250ms 1;
+            animation: mdc-floating-label-shake-float-above-text-field-box 250ms 1; }
+  .mdc-text-field--box .mdc-text-field__input {
+    align-self: flex-end;
+    box-sizing: border-box;
+    height: 100%;
+    padding: 20px 16px 0; }
+  .mdc-text-field--box .mdc-floating-label {
+    /* @noflip */
+    left: 16px;
+    /* @noflip */
+    right: initial;
+    position: absolute;
+    bottom: 20px;
+    width: calc(100% - 48px);
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    pointer-events: none;
+    overflow: hidden;
+    will-change: transform; }
+    [dir="rtl"] .mdc-text-field--box .mdc-floating-label, .mdc-text-field--box .mdc-floating-label[dir="rtl"] {
+      /* @noflip */
+      left: initial;
+      /* @noflip */
+      right: 16px; }
+
+.mdc-text-field--box.mdc-text-field--disabled {
+  background-color: #fafafa;
+  border-bottom: none; }
+  .mdc-text-field--box.mdc-text-field--disabled .mdc-text-field__input {
+    border-bottom-color: rgba(0, 0, 0, 0.06); }
+  .mdc-text-field--box.mdc-text-field--disabled:not(.mdc-text-field--disabled) .mdc-floating-label {
+    color: rgba(0, 0, 0, 0.37); }
+  .mdc-text-field--box.mdc-text-field--disabled:not(.mdc-text-field--disabled) .mdc-text-field__input::-webkit-input-placeholder {
+    color: rgba(0, 0, 0, 0.37); }
+  .mdc-text-field--box.mdc-text-field--disabled:not(.mdc-text-field--disabled) .mdc-text-field__input:-ms-input-placeholder {
+    color: rgba(0, 0, 0, 0.37); }
+  .mdc-text-field--box.mdc-text-field--disabled:not(.mdc-text-field--disabled) .mdc-text-field__input::-ms-input-placeholder {
+    color: rgba(0, 0, 0, 0.37); }
+  .mdc-text-field--box.mdc-text-field--disabled:not(.mdc-text-field--disabled) .mdc-text-field__input::placeholder {
+    color: rgba(0, 0, 0, 0.37); }
+
+.mdc-text-field--box.mdc-text-field--dense .mdc-floating-label--float-above {
+  -webkit-transform: translateY(-70%) scale(0.923);
+          transform: translateY(-70%) scale(0.923); }
+
+.mdc-text-field--box.mdc-text-field--dense .mdc-floating-label--shake {
+  -webkit-animation: mdc-floating-label-shake-float-above-text-field-box-dense 250ms 1;
+          animation: mdc-floating-label-shake-float-above-text-field-box-dense 250ms 1; }
+
+.mdc-text-field--box.mdc-text-field--dense .mdc-text-field__input {
+  padding: 12px 12px 0; }
+
+.mdc-text-field--with-leading-icon .mdc-text-field__icon {
+  /* @noflip */
+  left: 15px;
+  /* @noflip */
+  right: initial; }
+  [dir="rtl"] .mdc-text-field--with-leading-icon .mdc-text-field__icon, .mdc-text-field--with-leading-icon .mdc-text-field__icon[dir="rtl"] {
+    /* @noflip */
+    left: initial;
+    /* @noflip */
+    right: 15px; }
+
+.mdc-text-field--with-leading-icon .mdc-text-field__input {
+  /* @noflip */
+  padding-left: 48px;
+  /* @noflip */
+  padding-right: 15px; }
+  [dir="rtl"] .mdc-text-field--with-leading-icon .mdc-text-field__input, .mdc-text-field--with-leading-icon .mdc-text-field__input[dir="rtl"] {
+    /* @noflip */
+    padding-left: 15px;
+    /* @noflip */
+    padding-right: 48px; }
+
+.mdc-text-field--with-leading-icon .mdc-floating-label {
+  /* @noflip */
+  left: 48px;
+  /* @noflip */
+  right: initial; }
+  [dir="rtl"] .mdc-text-field--with-leading-icon .mdc-floating-label, .mdc-text-field--with-leading-icon .mdc-floating-label[dir="rtl"] {
+    /* @noflip */
+    left: initial;
+    /* @noflip */
+    right: 48px; }
+
+.mdc-text-field--with-leading-icon.mdc-text-field--outlined .mdc-floating-label--float-above {
+  -webkit-transform: translateY(-130%) translateX(-32px) scale(0.75);
+          transform: translateY(-130%) translateX(-32px) scale(0.75); }
+  [dir="rtl"] .mdc-text-field--with-leading-icon.mdc-text-field--outlined .mdc-floating-label--float-above, .mdc-text-field--with-leading-icon.mdc-text-field--outlined .mdc-floating-label--float-above[dir="rtl"] {
+    -webkit-transform: translateY(-130%) translateX(32px) scale(0.75);
+            transform: translateY(-130%) translateX(32px) scale(0.75); }
+
+.mdc-text-field--with-leading-icon.mdc-text-field--outlined .mdc-floating-label--shake {
+  -webkit-animation: mdc-floating-label-shake-float-above-text-field-outlined-leading-icon 250ms 1;
+          animation: mdc-floating-label-shake-float-above-text-field-outlined-leading-icon 250ms 1; }
+
+[dir="rtl"] .mdc-text-field--with-leading-icon.mdc-text-field--outlined .mdc-floating-label--shake, .mdc-text-field--with-leading-icon.mdc-text-field--outlined[dir="rtl"] .mdc-floating-label--shake {
+  -webkit-animation: mdc-floating-label-shake-float-above-text-field-outlined-leading-icon-rtl 250ms 1;
+          animation: mdc-floating-label-shake-float-above-text-field-outlined-leading-icon-rtl 250ms 1; }
+
+.mdc-text-field--with-leading-icon.mdc-text-field--outlined.mdc-text-field--dense .mdc-floating-label--float-above {
+  -webkit-transform: translateY(-110%) translateX(-21px) scale(0.923);
+          transform: translateY(-110%) translateX(-21px) scale(0.923); }
+  [dir="rtl"] .mdc-text-field--with-leading-icon.mdc-text-field--outlined.mdc-text-field--dense .mdc-floating-label--float-above, .mdc-text-field--with-leading-icon.mdc-text-field--outlined.mdc-text-field--dense .mdc-floating-label--float-above[dir="rtl"] {
+    -webkit-transform: translateY(-110%) translateX(21px) scale(0.923);
+            transform: translateY(-110%) translateX(21px) scale(0.923); }
+
+.mdc-text-field--with-leading-icon.mdc-text-field--outlined.mdc-text-field--dense .mdc-floating-label--shake {
+  -webkit-animation: mdc-floating-label-shake-float-above-text-field-outlined-leading-icon-dense 250ms 1;
+          animation: mdc-floating-label-shake-float-above-text-field-outlined-leading-icon-dense 250ms 1; }
+
+[dir="rtl"] .mdc-text-field--with-leading-icon.mdc-text-field--outlined.mdc-text-field--dense .mdc-floating-label--shake, .mdc-text-field--with-leading-icon.mdc-text-field--outlined.mdc-text-field--dense[dir="rtl"] .mdc-floating-label--shake {
+  -webkit-animation: mdc-floating-label-shake-float-above-text-field-outlined-leading-icon-dense-rtl 250ms 1;
+          animation: mdc-floating-label-shake-float-above-text-field-outlined-leading-icon-dense-rtl 250ms 1; }
+
+.mdc-text-field--with-trailing-icon .mdc-text-field__icon {
+  /* @noflip */
+  left: initial;
+  /* @noflip */
+  right: 15px; }
+  [dir="rtl"] .mdc-text-field--with-trailing-icon .mdc-text-field__icon, .mdc-text-field--with-trailing-icon .mdc-text-field__icon[dir="rtl"] {
+    /* @noflip */
+    left: 15px;
+    /* @noflip */
+    right: initial; }
+
+.mdc-text-field--with-trailing-icon .mdc-text-field__input {
+  /* @noflip */
+  padding-left: 15px;
+  /* @noflip */
+  padding-right: 48px; }
+  [dir="rtl"] .mdc-text-field--with-trailing-icon .mdc-text-field__input, .mdc-text-field--with-trailing-icon .mdc-text-field__input[dir="rtl"] {
+    /* @noflip */
+    padding-left: 48px;
+    /* @noflip */
+    padding-right: 15px; }
+
+.mdc-text-field--with-leading-icon.mdc-text-field--dense .mdc-text-field__icon,
+.mdc-text-field--with-trailing-icon.mdc-text-field--dense .mdc-text-field__icon {
+  bottom: 16px;
+  -webkit-transform: scale(0.8);
+          transform: scale(0.8); }
+
+.mdc-text-field--with-leading-icon.mdc-text-field--dense .mdc-text-field__icon {
+  /* @noflip */
+  left: 12px;
+  /* @noflip */
+  right: initial; }
+  [dir="rtl"] .mdc-text-field--with-leading-icon.mdc-text-field--dense .mdc-text-field__icon, .mdc-text-field--with-leading-icon.mdc-text-field--dense .mdc-text-field__icon[dir="rtl"] {
+    /* @noflip */
+    left: initial;
+    /* @noflip */
+    right: 12px; }
+
+.mdc-text-field--with-leading-icon.mdc-text-field--dense .mdc-text-field__input {
+  /* @noflip */
+  padding-left: 38px;
+  /* @noflip */
+  padding-right: 12px; }
+  [dir="rtl"] .mdc-text-field--with-leading-icon.mdc-text-field--dense .mdc-text-field__input, .mdc-text-field--with-leading-icon.mdc-text-field--dense .mdc-text-field__input[dir="rtl"] {
+    /* @noflip */
+    padding-left: 12px;
+    /* @noflip */
+    padding-right: 38px; }
+
+.mdc-text-field--with-leading-icon.mdc-text-field--dense .mdc-floating-label {
+  /* @noflip */
+  left: 38px;
+  /* @noflip */
+  right: initial; }
+  [dir="rtl"] .mdc-text-field--with-leading-icon.mdc-text-field--dense .mdc-floating-label, .mdc-text-field--with-leading-icon.mdc-text-field--dense .mdc-floating-label[dir="rtl"] {
+    /* @noflip */
+    left: initial;
+    /* @noflip */
+    right: 38px; }
+
+.mdc-text-field--with-trailing-icon.mdc-text-field--dense .mdc-text-field__icon {
+  /* @noflip */
+  left: initial;
+  /* @noflip */
+  right: 12px; }
+  [dir="rtl"] .mdc-text-field--with-trailing-icon.mdc-text-field--dense .mdc-text-field__icon, .mdc-text-field--with-trailing-icon.mdc-text-field--dense .mdc-text-field__icon[dir="rtl"] {
+    /* @noflip */
+    left: 12px;
+    /* @noflip */
+    right: initial; }
+
+.mdc-text-field--with-trailing-icon.mdc-text-field--dense .mdc-text-field__input {
+  /* @noflip */
+  padding-left: 12px;
+  /* @noflip */
+  padding-right: 38px; }
+  [dir="rtl"] .mdc-text-field--with-trailing-icon.mdc-text-field--dense .mdc-text-field__input, .mdc-text-field--with-trailing-icon.mdc-text-field--dense .mdc-text-field__input[dir="rtl"] {
+    /* @noflip */
+    padding-left: 38px;
+    /* @noflip */
+    padding-right: 12px; }
+
+.mdc-text-field--upgraded:not(.mdc-text-field--fullwidth):not(.mdc-text-field--box) {
+  display: inline-flex;
+  position: relative;
+  align-items: flex-end;
+  box-sizing: border-box;
+  margin-top: 16px; }
+  .mdc-text-field--upgraded:not(.mdc-text-field--fullwidth):not(.mdc-text-field--box):not(.mdc-text-field--textarea):not(.mdc-text-field--outlined) {
+    height: 48px; }
+
+.mdc-text-field--dense {
+  margin-top: 12px;
+  margin-bottom: 4px; }
+  .mdc-text-field--dense .mdc-floating-label--float-above {
+    -webkit-transform: translateY(-110%) scale(0.923);
+            transform: translateY(-110%) scale(0.923); }
+  .mdc-text-field--dense .mdc-floating-label {
+    font-size: .813rem; }
+
+.mdc-text-field__input:required + .mdc-floating-label::after {
+  margin-left: 1px;
+  content: "*"; }
+
+.mdc-text-field--textarea {
+  border-radius: 4px;
+  display: flex;
+  width: -webkit-fit-content;
+  width: -moz-fit-content;
+  width: fit-content;
+  height: initial;
+  transition: none;
+  border: 1px solid;
+  overflow: hidden; }
+  .mdc-text-field--textarea .mdc-floating-label {
+    border-radius: 4px 4px 0 0; }
+  .mdc-text-field--textarea .mdc-text-field__input {
+    border-radius: 2px; }
+  .mdc-text-field--textarea:not(.mdc-text-field--disabled) {
+    border-color: rgba(0, 0, 0, 0.73); }
+    .mdc-text-field--textarea:not(.mdc-text-field--disabled) .mdc-text-field__input:focus {
+      border-color: rgba(0, 0, 0, 0.73); }
+  .mdc-text-field--textarea .mdc-floating-label--float-above {
+    -webkit-transform: translateY(-50%) scale(0.923);
+            transform: translateY(-50%) scale(0.923); }
+  .mdc-text-field--textarea .mdc-floating-label--shake {
+    -webkit-animation: mdc-floating-label-shake-float-above-textarea 250ms 1;
+            animation: mdc-floating-label-shake-float-above-textarea 250ms 1; }
+  .mdc-text-field--textarea .mdc-text-field__input {
+    height: auto;
+    margin: 0;
+    padding: 16px;
+    padding-top: 32px;
+    border: 1px solid transparent; }
+  .mdc-text-field--textarea .mdc-floating-label {
+    background-color: white;
+    /* @noflip */
+    left: 1px;
+    /* @noflip */
+    right: 0;
+    /* @noflip */
+    margin-left: 8px;
+    /* @noflip */
+    margin-right: 0;
+    top: 18px;
+    bottom: auto;
+    margin-top: 2px;
+    padding: 12px 8px 8px 8px;
+    line-height: 1.15;
+    pointer-events: none; }
+    [dir="rtl"] .mdc-text-field--textarea .mdc-floating-label, .mdc-text-field--textarea .mdc-floating-label[dir="rtl"] {
+      /* @noflip */
+      left: 0;
+      /* @noflip */
+      right: 1px; }
+    [dir="rtl"] .mdc-text-field--textarea .mdc-floating-label, .mdc-text-field--textarea .mdc-floating-label[dir="rtl"] {
+      /* @noflip */
+      margin-left: 0;
+      /* @noflip */
+      margin-right: 8px; }
+
+.mdc-text-field--fullwidth {
+  width: 100%; }
+  .mdc-text-field--fullwidth .mdc-text-field__input {
+    resize: vertical; }
+  .mdc-text-field--fullwidth:not(.mdc-text-field--textarea) {
+    display: block;
+    box-sizing: border-box;
+    height: 56px;
+    margin: 0;
+    border: none;
+    border-bottom: 1px solid;
+    outline: none; }
+    .mdc-text-field--fullwidth:not(.mdc-text-field--textarea) .mdc-text-field__input {
+      width: 100%;
+      height: 100%;
+      padding: 0;
+      resize: none;
+      border: none !important; }
+
+.mdc-text-field--fullwidth.mdc-text-field--invalid:not(.mdc-text-field--disabled):not(.mdc-text-field--textarea) {
+  border-bottom-color: #b00020; }
+
+.mdc-text-field--dense + .mdc-text-field-helper-text {
+  margin-bottom: 4px; }
+
+.mdc-text-field--box + .mdc-text-field-helper-text,
+.mdc-text-field--outlined + .mdc-text-field-helper-text,
+.mdc-text-field--textarea + .mdc-text-field-helper-text {
+  margin-right: 16px;
+  margin-left: 16px; }
+
+.mdc-form-field > .mdc-text-field + label {
+  align-self: flex-start; }
+
+.mdc-text-field--focused:not(.mdc-text-field--disabled) .mdc-floating-label {
+  color: rgba(98, 0, 238, 0.87); }
+
+.mdc-text-field--focused:not(.mdc-text-field--disabled) .mdc-text-field__input::-webkit-input-placeholder {
+  color: rgba(98, 0, 238, 0.87); }
+
+.mdc-text-field--focused:not(.mdc-text-field--disabled) .mdc-text-field__input:-ms-input-placeholder {
+  color: rgba(98, 0, 238, 0.87); }
+
+.mdc-text-field--focused:not(.mdc-text-field--disabled) .mdc-text-field__input::-ms-input-placeholder {
+  color: rgba(98, 0, 238, 0.87); }
+
+.mdc-text-field--focused:not(.mdc-text-field--disabled) .mdc-text-field__input::placeholder {
+  color: rgba(98, 0, 238, 0.87); }
+
+.mdc-text-field--focused .mdc-text-field__input:required + .mdc-floating-label::after {
+  color: #b00020; }
+
+.mdc-text-field--focused + .mdc-text-field-helper-text:not(.mdc-text-field-helper-text--validation-msg) {
+  opacity: 1; }
+
+.mdc-text-field--textarea.mdc-text-field--focused:not(.mdc-text-field--disabled) {
+  border-color: #6200ee;
+  /* @alternate */
+  border-color: var(--mdc-theme-primary, #6200ee); }
+  .mdc-text-field--textarea.mdc-text-field--focused:not(.mdc-text-field--disabled) .mdc-text-field__input:focus {
+    border-color: #6200ee;
+    /* @alternate */
+    border-color: var(--mdc-theme-primary, #6200ee); }
+
+.mdc-text-field--invalid:not(.mdc-text-field--disabled):not(.mdc-text-field--outlined):not(.mdc-text-field--textarea) .mdc-text-field__input {
+  border-bottom-color: #b00020; }
+
+.mdc-text-field--invalid:not(.mdc-text-field--disabled):not(.mdc-text-field--outlined):not(.mdc-text-field--textarea) .mdc-text-field__input:hover {
+  border-bottom-color: #b00020; }
+
+.mdc-text-field--invalid:not(.mdc-text-field--disabled) .mdc-line-ripple {
+  background-color: #b00020; }
+
+.mdc-text-field--invalid:not(.mdc-text-field--disabled) .mdc-floating-label {
+  color: #b00020; }
+
+.mdc-text-field--invalid:not(.mdc-text-field--disabled) .mdc-text-field__input::-webkit-input-placeholder {
+  color: #b00020; }
+
+.mdc-text-field--invalid:not(.mdc-text-field--disabled) .mdc-text-field__input:-ms-input-placeholder {
+  color: #b00020; }
+
+.mdc-text-field--invalid:not(.mdc-text-field--disabled) .mdc-text-field__input::-ms-input-placeholder {
+  color: #b00020; }
+
+.mdc-text-field--invalid:not(.mdc-text-field--disabled) .mdc-text-field__input::placeholder {
+  color: #b00020; }
+
+.mdc-text-field--invalid:not(.mdc-text-field--disabled).mdc-text-field--invalid + .mdc-text-field-helper-text--validation-msg {
+  color: #b00020; }
+
+.mdc-text-field--invalid .mdc-text-field__input {
+  caret-color: #b00020; }
+
+.mdc-text-field--invalid.mdc-text-field--with-trailing-icon:not(.mdc-text-field--disabled) .mdc-text-field__icon {
+  color: #b00020; }
+
+.mdc-text-field--invalid + .mdc-text-field-helper-text--validation-msg {
+  opacity: 1; }
+
+.mdc-text-field--textarea.mdc-text-field--invalid:not(.mdc-text-field--disabled) {
+  border-color: #b00020; }
+  .mdc-text-field--textarea.mdc-text-field--invalid:not(.mdc-text-field--disabled) .mdc-text-field__input:focus {
+    border-color: #b00020; }
+
+.mdc-text-field--outlined.mdc-text-field--invalid:not(.mdc-text-field--disabled) .mdc-notched-outline__idle {
+  border-color: #b00020; }
+
+.mdc-text-field--outlined.mdc-text-field--invalid:not(.mdc-text-field--disabled) .mdc-notched-outline__path {
+  stroke: #b00020; }
+
+.mdc-text-field--outlined.mdc-text-field--invalid:not(.mdc-text-field--disabled):not(.mdc-text-field--focused) .mdc-text-field__input:hover ~ .mdc-notched-outline__idle,
+.mdc-text-field--outlined.mdc-text-field--invalid:not(.mdc-text-field--disabled):not(.mdc-text-field--focused) .mdc-text-field__icon:hover ~ .mdc-notched-outline__idle {
+  border-color: #b00020; }
+
+.mdc-text-field--outlined.mdc-text-field--invalid:not(.mdc-text-field--disabled):not(.mdc-text-field--focused) .mdc-text-field__input:hover ~ .mdc-notched-outline .mdc-notched-outline__path,
+.mdc-text-field--outlined.mdc-text-field--invalid:not(.mdc-text-field--disabled):not(.mdc-text-field--focused) .mdc-text-field__icon:hover ~ .mdc-notched-outline .mdc-notched-outline__path {
+  stroke: #b00020; }
+
+.mdc-text-field--outlined.mdc-text-field--invalid:not(.mdc-text-field--disabled).mdc-text-field--focused .mdc-notched-outline__path {
+  stroke: #b00020; }
+
+.mdc-text-field--disabled {
+  pointer-events: none; }
+  .mdc-text-field--disabled .mdc-text-field__input {
+    border-bottom-color: rgba(35, 31, 32, 0.26); }
+  .mdc-text-field--disabled .mdc-text-field__input {
+    color: rgba(0, 0, 0, 0.37); }
+  .mdc-text-field--disabled .mdc-floating-label {
+    color: rgba(0, 0, 0, 0.37); }
+  .mdc-text-field--disabled .mdc-text-field__input::-webkit-input-placeholder {
+    color: rgba(0, 0, 0, 0.37); }
+  .mdc-text-field--disabled .mdc-text-field__input:-ms-input-placeholder {
+    color: rgba(0, 0, 0, 0.37); }
+  .mdc-text-field--disabled .mdc-text-field__input::-ms-input-placeholder {
+    color: rgba(0, 0, 0, 0.37); }
+  .mdc-text-field--disabled .mdc-text-field__input::placeholder {
+    color: rgba(0, 0, 0, 0.37); }
+  .mdc-text-field--disabled + .mdc-text-field-helper-text {
+    color: rgba(0, 0, 0, 0.37); }
+  .mdc-text-field--disabled .mdc-text-field__icon {
+    color: rgba(0, 0, 0, 0.3); }
+  .mdc-text-field--disabled:not(.mdc-text-field--textarea) {
+    border-bottom-color: rgba(0, 0, 0, 0.12); }
+  .mdc-text-field--disabled .mdc-text-field__input {
+    border-bottom: 1px dotted; }
+  .mdc-text-field--disabled .mdc-floating-label {
+    cursor: default; }
+
+.mdc-text-field--textarea.mdc-text-field--disabled {
+  border-color: rgba(35, 31, 32, 0.26);
+  background-color: #f9f9f9;
+  border-style: solid; }
+  .mdc-text-field--textarea.mdc-text-field--disabled .mdc-text-field__input:focus {
+    border-color: rgba(35, 31, 32, 0.26); }
+  .mdc-text-field--textarea.mdc-text-field--disabled .mdc-text-field__input {
+    border: 1px solid transparent; }
+  .mdc-text-field--textarea.mdc-text-field--disabled .mdc-floating-label {
+    background-color: #f9f9f9; }
+
+@-webkit-keyframes mdc-floating-label-shake-float-above-text-field-box {
+  0% {
+    -webkit-transform: translateX(calc(0 - 0%)) translateY(-50%) scale(0.75);
+            transform: translateX(calc(0 - 0%)) translateY(-50%) scale(0.75); }
+  33% {
+    -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582);
+            animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582);
+    -webkit-transform: translateX(calc(4% - 0%)) translateY(-50%) scale(0.75);
+            transform: translateX(calc(4% - 0%)) translateY(-50%) scale(0.75); }
+  66% {
+    -webkit-animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);
+            animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);
+    -webkit-transform: translateX(calc(-4% - 0%)) translateY(-50%) scale(0.75);
+            transform: translateX(calc(-4% - 0%)) translateY(-50%) scale(0.75); }
+  100% {
+    -webkit-transform: translateX(calc(0 - 0%)) translateY(-50%) scale(0.75);
+            transform: translateX(calc(0 - 0%)) translateY(-50%) scale(0.75); } }
+
+@keyframes mdc-floating-label-shake-float-above-text-field-box {
+  0% {
+    -webkit-transform: translateX(calc(0 - 0%)) translateY(-50%) scale(0.75);
+            transform: translateX(calc(0 - 0%)) translateY(-50%) scale(0.75); }
+  33% {
+    -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582);
+            animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582);
+    -webkit-transform: translateX(calc(4% - 0%)) translateY(-50%) scale(0.75);
+            transform: translateX(calc(4% - 0%)) translateY(-50%) scale(0.75); }
+  66% {
+    -webkit-animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);
+            animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);
+    -webkit-transform: translateX(calc(-4% - 0%)) translateY(-50%) scale(0.75);
+            transform: translateX(calc(-4% - 0%)) translateY(-50%) scale(0.75); }
+  100% {
+    -webkit-transform: translateX(calc(0 - 0%)) translateY(-50%) scale(0.75);
+            transform: translateX(calc(0 - 0%)) translateY(-50%) scale(0.75); } }
+
+@-webkit-keyframes mdc-floating-label-shake-float-above-text-field-box-dense {
+  0% {
+    -webkit-transform: translateX(calc(0 - 0%)) translateY(-70%) scale(0.923);
+            transform: translateX(calc(0 - 0%)) translateY(-70%) scale(0.923); }
+  33% {
+    -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582);
+            animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582);
+    -webkit-transform: translateX(calc(4% - 0%)) translateY(-70%) scale(0.923);
+            transform: translateX(calc(4% - 0%)) translateY(-70%) scale(0.923); }
+  66% {
+    -webkit-animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);
+            animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);
+    -webkit-transform: translateX(calc(-4% - 0%)) translateY(-70%) scale(0.923);
+            transform: translateX(calc(-4% - 0%)) translateY(-70%) scale(0.923); }
+  100% {
+    -webkit-transform: translateX(calc(0 - 0%)) translateY(-70%) scale(0.923);
+            transform: translateX(calc(0 - 0%)) translateY(-70%) scale(0.923); } }
+
+@keyframes mdc-floating-label-shake-float-above-text-field-box-dense {
+  0% {
+    -webkit-transform: translateX(calc(0 - 0%)) translateY(-70%) scale(0.923);
+            transform: translateX(calc(0 - 0%)) translateY(-70%) scale(0.923); }
+  33% {
+    -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582);
+            animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582);
+    -webkit-transform: translateX(calc(4% - 0%)) translateY(-70%) scale(0.923);
+            transform: translateX(calc(4% - 0%)) translateY(-70%) scale(0.923); }
+  66% {
+    -webkit-animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);
+            animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);
+    -webkit-transform: translateX(calc(-4% - 0%)) translateY(-70%) scale(0.923);
+            transform: translateX(calc(-4% - 0%)) translateY(-70%) scale(0.923); }
+  100% {
+    -webkit-transform: translateX(calc(0 - 0%)) translateY(-70%) scale(0.923);
+            transform: translateX(calc(0 - 0%)) translateY(-70%) scale(0.923); } }
+
+@-webkit-keyframes mdc-floating-label-shake-float-above-text-field-outlined {
+  0% {
+    -webkit-transform: translateX(calc(0 - 0%)) translateY(-130%) scale(0.75);
+            transform: translateX(calc(0 - 0%)) translateY(-130%) scale(0.75); }
+  33% {
+    -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582);
+            animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582);
+    -webkit-transform: translateX(calc(4% - 0%)) translateY(-130%) scale(0.75);
+            transform: translateX(calc(4% - 0%)) translateY(-130%) scale(0.75); }
+  66% {
+    -webkit-animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);
+            animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);
+    -webkit-transform: translateX(calc(-4% - 0%)) translateY(-130%) scale(0.75);
+            transform: translateX(calc(-4% - 0%)) translateY(-130%) scale(0.75); }
+  100% {
+    -webkit-transform: translateX(calc(0 - 0%)) translateY(-130%) scale(0.75);
+            transform: translateX(calc(0 - 0%)) translateY(-130%) scale(0.75); } }
+
+@keyframes mdc-floating-label-shake-float-above-text-field-outlined {
+  0% {
+    -webkit-transform: translateX(calc(0 - 0%)) translateY(-130%) scale(0.75);
+            transform: translateX(calc(0 - 0%)) translateY(-130%) scale(0.75); }
+  33% {
+    -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582);
+            animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582);
+    -webkit-transform: translateX(calc(4% - 0%)) translateY(-130%) scale(0.75);
+            transform: translateX(calc(4% - 0%)) translateY(-130%) scale(0.75); }
+  66% {
+    -webkit-animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);
+            animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);
+    -webkit-transform: translateX(calc(-4% - 0%)) translateY(-130%) scale(0.75);
+            transform: translateX(calc(-4% - 0%)) translateY(-130%) scale(0.75); }
+  100% {
+    -webkit-transform: translateX(calc(0 - 0%)) translateY(-130%) scale(0.75);
+            transform: translateX(calc(0 - 0%)) translateY(-130%) scale(0.75); } }
+
+@-webkit-keyframes mdc-floating-label-shake-float-above-text-field-outlined-dense {
+  0% {
+    -webkit-transform: translateX(calc(0 - 0%)) translateY(-110%) scale(0.923);
+            transform: translateX(calc(0 - 0%)) translateY(-110%) scale(0.923); }
+  33% {
+    -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582);
+            animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582);
+    -webkit-transform: translateX(calc(4% - 0%)) translateY(-110%) scale(0.923);
+            transform: translateX(calc(4% - 0%)) translateY(-110%) scale(0.923); }
+  66% {
+    -webkit-animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);
+            animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);
+    -webkit-transform: translateX(calc(-4% - 0%)) translateY(-110%) scale(0.923);
+            transform: translateX(calc(-4% - 0%)) translateY(-110%) scale(0.923); }
+  100% {
+    -webkit-transform: translateX(calc(0 - 0%)) translateY(-110%) scale(0.923);
+            transform: translateX(calc(0 - 0%)) translateY(-110%) scale(0.923); } }
+
+@keyframes mdc-floating-label-shake-float-above-text-field-outlined-dense {
+  0% {
+    -webkit-transform: translateX(calc(0 - 0%)) translateY(-110%) scale(0.923);
+            transform: translateX(calc(0 - 0%)) translateY(-110%) scale(0.923); }
+  33% {
+    -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582);
+            animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582);
+    -webkit-transform: translateX(calc(4% - 0%)) translateY(-110%) scale(0.923);
+            transform: translateX(calc(4% - 0%)) translateY(-110%) scale(0.923); }
+  66% {
+    -webkit-animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);
+            animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);
+    -webkit-transform: translateX(calc(-4% - 0%)) translateY(-110%) scale(0.923);
+            transform: translateX(calc(-4% - 0%)) translateY(-110%) scale(0.923); }
+  100% {
+    -webkit-transform: translateX(calc(0 - 0%)) translateY(-110%) scale(0.923);
+            transform: translateX(calc(0 - 0%)) translateY(-110%) scale(0.923); } }
+
+@-webkit-keyframes mdc-floating-label-shake-float-above-text-field-outlined-leading-icon {
+  0% {
+    -webkit-transform: translateX(calc(0 - 32px)) translateY(-130%) scale(0.75);
+            transform: translateX(calc(0 - 32px)) translateY(-130%) scale(0.75); }
+  33% {
+    -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582);
+            animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582);
+    -webkit-transform: translateX(calc(4% - 32px)) translateY(-130%) scale(0.75);
+            transform: translateX(calc(4% - 32px)) translateY(-130%) scale(0.75); }
+  66% {
+    -webkit-animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);
+            animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);
+    -webkit-transform: translateX(calc(-4% - 32px)) translateY(-130%) scale(0.75);
+            transform: translateX(calc(-4% - 32px)) translateY(-130%) scale(0.75); }
+  100% {
+    -webkit-transform: translateX(calc(0 - 32px)) translateY(-130%) scale(0.75);
+            transform: translateX(calc(0 - 32px)) translateY(-130%) scale(0.75); } }
+
+@keyframes mdc-floating-label-shake-float-above-text-field-outlined-leading-icon {
+  0% {
+    -webkit-transform: translateX(calc(0 - 32px)) translateY(-130%) scale(0.75);
+            transform: translateX(calc(0 - 32px)) translateY(-130%) scale(0.75); }
+  33% {
+    -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582);
+            animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582);
+    -webkit-transform: translateX(calc(4% - 32px)) translateY(-130%) scale(0.75);
+            transform: translateX(calc(4% - 32px)) translateY(-130%) scale(0.75); }
+  66% {
+    -webkit-animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);
+            animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);
+    -webkit-transform: translateX(calc(-4% - 32px)) translateY(-130%) scale(0.75);
+            transform: translateX(calc(-4% - 32px)) translateY(-130%) scale(0.75); }
+  100% {
+    -webkit-transform: translateX(calc(0 - 32px)) translateY(-130%) scale(0.75);
+            transform: translateX(calc(0 - 32px)) translateY(-130%) scale(0.75); } }
+
+@-webkit-keyframes mdc-floating-label-shake-float-above-text-field-outlined-leading-icon-dense {
+  0% {
+    -webkit-transform: translateX(calc(0 - 21px)) translateY(-110%) scale(0.923);
+            transform: translateX(calc(0 - 21px)) translateY(-110%) scale(0.923); }
+  33% {
+    -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582);
+            animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582);
+    -webkit-transform: translateX(calc(4% - 21px)) translateY(-110%) scale(0.923);
+            transform: translateX(calc(4% - 21px)) translateY(-110%) scale(0.923); }
+  66% {
+    -webkit-animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);
+            animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);
+    -webkit-transform: translateX(calc(-4% - 21px)) translateY(-110%) scale(0.923);
+            transform: translateX(calc(-4% - 21px)) translateY(-110%) scale(0.923); }
+  100% {
+    -webkit-transform: translateX(calc(0 - 21px)) translateY(-110%) scale(0.923);
+            transform: translateX(calc(0 - 21px)) translateY(-110%) scale(0.923); } }
+
+@keyframes mdc-floating-label-shake-float-above-text-field-outlined-leading-icon-dense {
+  0% {
+    -webkit-transform: translateX(calc(0 - 21px)) translateY(-110%) scale(0.923);
+            transform: translateX(calc(0 - 21px)) translateY(-110%) scale(0.923); }
+  33% {
+    -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582);
+            animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582);
+    -webkit-transform: translateX(calc(4% - 21px)) translateY(-110%) scale(0.923);
+            transform: translateX(calc(4% - 21px)) translateY(-110%) scale(0.923); }
+  66% {
+    -webkit-animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);
+            animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);
+    -webkit-transform: translateX(calc(-4% - 21px)) translateY(-110%) scale(0.923);
+            transform: translateX(calc(-4% - 21px)) translateY(-110%) scale(0.923); }
+  100% {
+    -webkit-transform: translateX(calc(0 - 21px)) translateY(-110%) scale(0.923);
+            transform: translateX(calc(0 - 21px)) translateY(-110%) scale(0.923); } }
+
+@-webkit-keyframes mdc-floating-label-shake-float-above-text-field-outlined-leading-icon-rtl {
+  0% {
+    -webkit-transform: translateX(calc(0 - -32px)) translateY(-130%) scale(0.75);
+            transform: translateX(calc(0 - -32px)) translateY(-130%) scale(0.75); }
+  33% {
+    -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582);
+            animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582);
+    -webkit-transform: translateX(calc(4% - -32px)) translateY(-130%) scale(0.75);
+            transform: translateX(calc(4% - -32px)) translateY(-130%) scale(0.75); }
+  66% {
+    -webkit-animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);
+            animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);
+    -webkit-transform: translateX(calc(-4% - -32px)) translateY(-130%) scale(0.75);
+            transform: translateX(calc(-4% - -32px)) translateY(-130%) scale(0.75); }
+  100% {
+    -webkit-transform: translateX(calc(0 - -32px)) translateY(-130%) scale(0.75);
+            transform: translateX(calc(0 - -32px)) translateY(-130%) scale(0.75); } }
+
+@keyframes mdc-floating-label-shake-float-above-text-field-outlined-leading-icon-rtl {
+  0% {
+    -webkit-transform: translateX(calc(0 - -32px)) translateY(-130%) scale(0.75);
+            transform: translateX(calc(0 - -32px)) translateY(-130%) scale(0.75); }
+  33% {
+    -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582);
+            animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582);
+    -webkit-transform: translateX(calc(4% - -32px)) translateY(-130%) scale(0.75);
+            transform: translateX(calc(4% - -32px)) translateY(-130%) scale(0.75); }
+  66% {
+    -webkit-animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);
+            animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);
+    -webkit-transform: translateX(calc(-4% - -32px)) translateY(-130%) scale(0.75);
+            transform: translateX(calc(-4% - -32px)) translateY(-130%) scale(0.75); }
+  100% {
+    -webkit-transform: translateX(calc(0 - -32px)) translateY(-130%) scale(0.75);
+            transform: translateX(calc(0 - -32px)) translateY(-130%) scale(0.75); } }
+
+@-webkit-keyframes mdc-floating-label-shake-float-above-text-field-outlined-leading-icon-dense-rtl {
+  0% {
+    -webkit-transform: translateX(calc(0 - -21px)) translateY(-110%) scale(0.923);
+            transform: translateX(calc(0 - -21px)) translateY(-110%) scale(0.923); }
+  33% {
+    -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582);
+            animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582);
+    -webkit-transform: translateX(calc(4% - -21px)) translateY(-110%) scale(0.923);
+            transform: translateX(calc(4% - -21px)) translateY(-110%) scale(0.923); }
+  66% {
+    -webkit-animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);
+            animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);
+    -webkit-transform: translateX(calc(-4% - -21px)) translateY(-110%) scale(0.923);
+            transform: translateX(calc(-4% - -21px)) translateY(-110%) scale(0.923); }
+  100% {
+    -webkit-transform: translateX(calc(0 - -21px)) translateY(-110%) scale(0.923);
+            transform: translateX(calc(0 - -21px)) translateY(-110%) scale(0.923); } }
+
+@keyframes mdc-floating-label-shake-float-above-text-field-outlined-leading-icon-dense-rtl {
+  0% {
+    -webkit-transform: translateX(calc(0 - -21px)) translateY(-110%) scale(0.923);
+            transform: translateX(calc(0 - -21px)) translateY(-110%) scale(0.923); }
+  33% {
+    -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582);
+            animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582);
+    -webkit-transform: translateX(calc(4% - -21px)) translateY(-110%) scale(0.923);
+            transform: translateX(calc(4% - -21px)) translateY(-110%) scale(0.923); }
+  66% {
+    -webkit-animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);
+            animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);
+    -webkit-transform: translateX(calc(-4% - -21px)) translateY(-110%) scale(0.923);
+            transform: translateX(calc(-4% - -21px)) translateY(-110%) scale(0.923); }
+  100% {
+    -webkit-transform: translateX(calc(0 - -21px)) translateY(-110%) scale(0.923);
+            transform: translateX(calc(0 - -21px)) translateY(-110%) scale(0.923); } }
+
+@-webkit-keyframes mdc-floating-label-shake-float-above-textarea {
+  0% {
+    -webkit-transform: translateX(calc(0 - 0%)) translateY(-50%) scale(0.923);
+            transform: translateX(calc(0 - 0%)) translateY(-50%) scale(0.923); }
+  33% {
+    -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582);
+            animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582);
+    -webkit-transform: translateX(calc(4% - 0%)) translateY(-50%) scale(0.923);
+            transform: translateX(calc(4% - 0%)) translateY(-50%) scale(0.923); }
+  66% {
+    -webkit-animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);
+            animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);
+    -webkit-transform: translateX(calc(-4% - 0%)) translateY(-50%) scale(0.923);
+            transform: translateX(calc(-4% - 0%)) translateY(-50%) scale(0.923); }
+  100% {
+    -webkit-transform: translateX(calc(0 - 0%)) translateY(-50%) scale(0.923);
+            transform: translateX(calc(0 - 0%)) translateY(-50%) scale(0.923); } }
+
+@keyframes mdc-floating-label-shake-float-above-textarea {
+  0% {
+    -webkit-transform: translateX(calc(0 - 0%)) translateY(-50%) scale(0.923);
+            transform: translateX(calc(0 - 0%)) translateY(-50%) scale(0.923); }
+  33% {
+    -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582);
+            animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582);
+    -webkit-transform: translateX(calc(4% - 0%)) translateY(-50%) scale(0.923);
+            transform: translateX(calc(4% - 0%)) translateY(-50%) scale(0.923); }
+  66% {
+    -webkit-animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);
+            animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);
+    -webkit-transform: translateX(calc(-4% - 0%)) translateY(-50%) scale(0.923);
+            transform: translateX(calc(-4% - 0%)) translateY(-50%) scale(0.923); }
+  100% {
+    -webkit-transform: translateX(calc(0 - 0%)) translateY(-50%) scale(0.923);
+            transform: translateX(calc(0 - 0%)) translateY(-50%) scale(0.923); } }
+
+/*# sourceMappingURL=mdc.textfield.css.map*/
\ No newline at end of file
diff --git a/node_modules/@material/textfield/dist/mdc.textfield.js b/node_modules/@material/textfield/dist/mdc.textfield.js
new file mode 100644
index 0000000..36aa0bb
--- /dev/null
+++ b/node_modules/@material/textfield/dist/mdc.textfield.js
@@ -0,0 +1,5592 @@
+/*!
+ Material Components for the Web
+ Copyright (c) 2018 Google Inc.
+ License: Apache-2.0
+*/
+(function webpackUniversalModuleDefinition(root, factory) {
+	if(typeof exports === 'object' && typeof module === 'object')
+		module.exports = factory();
+	else if(typeof define === 'function' && define.amd)
+		define([], factory);
+	else if(typeof exports === 'object')
+		exports["textfield"] = factory();
+	else
+		root["mdc"] = root["mdc"] || {}, root["mdc"]["textfield"] = factory();
+})(this, function() {
+return /******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, {
+/******/ 				configurable: false,
+/******/ 				enumerable: true,
+/******/ 				get: getter
+/******/ 			});
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "";
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = 141);
+/******/ })
+/************************************************************************/
+/******/ ({
+
+/***/ 0:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * @license
+ * Copyright 2016 Google Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * @template A
+ */
+var MDCFoundation = function () {
+  _createClass(MDCFoundation, null, [{
+    key: "cssClasses",
+
+    /** @return enum{cssClasses} */
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports every
+      // CSS class the foundation class needs as a property. e.g. {ACTIVE: 'mdc-component--active'}
+      return {};
+    }
+
+    /** @return enum{strings} */
+
+  }, {
+    key: "strings",
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports all
+      // semantic strings as constants. e.g. {ARIA_ROLE: 'tablist'}
+      return {};
+    }
+
+    /** @return enum{numbers} */
+
+  }, {
+    key: "numbers",
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports all
+      // of its semantic numbers as constants. e.g. {ANIMATION_DELAY_MS: 350}
+      return {};
+    }
+
+    /** @return {!Object} */
+
+  }, {
+    key: "defaultAdapter",
+    get: function get() {
+      // Classes extending MDCFoundation may choose to implement this getter in order to provide a convenient
+      // way of viewing the necessary methods of an adapter. In the future, this could also be used for adapter
+      // validation.
+      return {};
+    }
+
+    /**
+     * @param {A=} adapter
+     */
+
+  }]);
+
+  function MDCFoundation() {
+    var adapter = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+
+    _classCallCheck(this, MDCFoundation);
+
+    /** @protected {!A} */
+    this.adapter_ = adapter;
+  }
+
+  _createClass(MDCFoundation, [{
+    key: "init",
+    value: function init() {
+      // Subclasses should override this method to perform initialization routines (registering events, etc.)
+    }
+  }, {
+    key: "destroy",
+    value: function destroy() {
+      // Subclasses should override this method to perform de-initialization routines (de-registering events, etc.)
+    }
+  }]);
+
+  return MDCFoundation;
+}();
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCFoundation);
+
+/***/ }),
+
+/***/ 1:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__foundation__ = __webpack_require__(0);
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * @license
+ * Copyright 2016 Google Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+/**
+ * @template F
+ */
+
+var MDCComponent = function () {
+  _createClass(MDCComponent, null, [{
+    key: 'attachTo',
+
+    /**
+     * @param {!Element} root
+     * @return {!MDCComponent}
+     */
+    value: function attachTo(root) {
+      // Subclasses which extend MDCBase should provide an attachTo() method that takes a root element and
+      // returns an instantiated component with its root set to that element. Also note that in the cases of
+      // subclasses, an explicit foundation class will not have to be passed in; it will simply be initialized
+      // from getDefaultFoundation().
+      return new MDCComponent(root, new __WEBPACK_IMPORTED_MODULE_0__foundation__["a" /* default */]());
+    }
+
+    /**
+     * @param {!Element} root
+     * @param {F=} foundation
+     * @param {...?} args
+     */
+
+  }]);
+
+  function MDCComponent(root) {
+    var foundation = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : undefined;
+
+    _classCallCheck(this, MDCComponent);
+
+    /** @protected {!Element} */
+    this.root_ = root;
+
+    for (var _len = arguments.length, args = Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++) {
+      args[_key - 2] = arguments[_key];
+    }
+
+    this.initialize.apply(this, args);
+    // Note that we initialize foundation here and not within the constructor's default param so that
+    // this.root_ is defined and can be used within the foundation class.
+    /** @protected {!F} */
+    this.foundation_ = foundation === undefined ? this.getDefaultFoundation() : foundation;
+    this.foundation_.init();
+    this.initialSyncWithDOM();
+  }
+
+  _createClass(MDCComponent, [{
+    key: 'initialize',
+    value: function initialize() /* ...args */{}
+    // Subclasses can override this to do any additional setup work that would be considered part of a
+    // "constructor". Essentially, it is a hook into the parent constructor before the foundation is
+    // initialized. Any additional arguments besides root and foundation will be passed in here.
+
+
+    /**
+     * @return {!F} foundation
+     */
+
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      // Subclasses must override this method to return a properly configured foundation class for the
+      // component.
+      throw new Error('Subclasses must override getDefaultFoundation to return a properly configured ' + 'foundation class');
+    }
+  }, {
+    key: 'initialSyncWithDOM',
+    value: function initialSyncWithDOM() {
+      // Subclasses should override this method if they need to perform work to synchronize with a host DOM
+      // object. An example of this would be a form control wrapper that needs to synchronize its internal state
+      // to some property or attribute of the host DOM. Please note: this is *not* the place to perform DOM
+      // reads/writes that would cause layout / paint, as this is called synchronously from within the constructor.
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      // Subclasses may implement this method to release any resources / deregister any listeners they have
+      // attached. An example of this might be deregistering a resize event from the window object.
+      this.foundation_.destroy();
+    }
+
+    /**
+     * Wrapper method to add an event listener to the component's root element. This is most useful when
+     * listening for custom events.
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: 'listen',
+    value: function listen(evtType, handler) {
+      this.root_.addEventListener(evtType, handler);
+    }
+
+    /**
+     * Wrapper method to remove an event listener to the component's root element. This is most useful when
+     * unlistening for custom events.
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: 'unlisten',
+    value: function unlisten(evtType, handler) {
+      this.root_.removeEventListener(evtType, handler);
+    }
+
+    /**
+     * Fires a cross-browser-compatible custom event from the component root of the given type,
+     * with the given data.
+     * @param {string} evtType
+     * @param {!Object} evtData
+     * @param {boolean=} shouldBubble
+     */
+
+  }, {
+    key: 'emit',
+    value: function emit(evtType, evtData) {
+      var shouldBubble = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
+
+      var evt = void 0;
+      if (typeof CustomEvent === 'function') {
+        evt = new CustomEvent(evtType, {
+          detail: evtData,
+          bubbles: shouldBubble
+        });
+      } else {
+        evt = document.createEvent('CustomEvent');
+        evt.initCustomEvent(evtType, shouldBubble, false, evtData);
+      }
+
+      this.root_.dispatchEvent(evt);
+    }
+  }]);
+
+  return MDCComponent;
+}();
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCComponent);
+
+/***/ }),
+
+/***/ 13:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * @license
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/* eslint no-unused-vars: [2, {"args": "none"}] */
+
+/**
+ * Adapter for MDC Floating Label.
+ *
+ * Defines the shape of the adapter expected by the foundation. Implement this
+ * adapter to integrate the floating label into your framework. See
+ * https://github.com/material-components/material-components-web/blob/master/docs/authoring-components.md
+ * for more information.
+ *
+ * @record
+ */
+var MDCFloatingLabelAdapter = function () {
+  function MDCFloatingLabelAdapter() {
+    _classCallCheck(this, MDCFloatingLabelAdapter);
+  }
+
+  _createClass(MDCFloatingLabelAdapter, [{
+    key: "addClass",
+
+    /**
+     * Adds a class to the label element.
+     * @param {string} className
+     */
+    value: function addClass(className) {}
+
+    /**
+     * Removes a class from the label element.
+     * @param {string} className
+     */
+
+  }, {
+    key: "removeClass",
+    value: function removeClass(className) {}
+
+    /**
+     * Returns the width of the label element.
+     * @return {number}
+     */
+
+  }, {
+    key: "getWidth",
+    value: function getWidth() {}
+
+    /**
+     * Registers an event listener on the root element for a given event.
+     * @param {string} evtType
+     * @param {function(!Event): undefined} handler
+     */
+
+  }, {
+    key: "registerInteractionHandler",
+    value: function registerInteractionHandler(evtType, handler) {}
+
+    /**
+     * Deregisters an event listener on the root element for a given event.
+     * @param {string} evtType
+     * @param {function(!Event): undefined} handler
+     */
+
+  }, {
+    key: "deregisterInteractionHandler",
+    value: function deregisterInteractionHandler(evtType, handler) {}
+  }]);
+
+  return MDCFloatingLabelAdapter;
+}();
+
+/* unused harmony default export */ var _unused_webpack_default_export = (MDCFloatingLabelAdapter);
+
+/***/ }),
+
+/***/ 14:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * @license
+ * Copyright 2018 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/* eslint no-unused-vars: [2, {"args": "none"}] */
+
+/**
+ * Adapter for MDC TextField Line Ripple.
+ *
+ * Defines the shape of the adapter expected by the foundation. Implement this
+ * adapter to integrate the line ripple into your framework. See
+ * https://github.com/material-components/material-components-web/blob/master/docs/authoring-components.md
+ * for more information.
+ *
+ * @record
+ */
+var MDCLineRippleAdapter = function () {
+  function MDCLineRippleAdapter() {
+    _classCallCheck(this, MDCLineRippleAdapter);
+  }
+
+  _createClass(MDCLineRippleAdapter, [{
+    key: "addClass",
+
+    /**
+     * Adds a class to the line ripple element.
+     * @param {string} className
+     */
+    value: function addClass(className) {}
+
+    /**
+     * Removes a class from the line ripple element.
+     * @param {string} className
+     */
+
+  }, {
+    key: "removeClass",
+    value: function removeClass(className) {}
+
+    /**
+     * @param {string} className
+     * @return {boolean}
+     */
+
+  }, {
+    key: "hasClass",
+    value: function hasClass(className) {}
+
+    /**
+     * Sets the style property with propertyName to value on the root element.
+     * @param {string} propertyName
+     * @param {string} value
+     */
+
+  }, {
+    key: "setStyle",
+    value: function setStyle(propertyName, value) {}
+
+    /**
+     * Registers an event listener on the line ripple element for a given event.
+     * @param {string} evtType
+     * @param {function(!Event): undefined} handler
+     */
+
+  }, {
+    key: "registerEventHandler",
+    value: function registerEventHandler(evtType, handler) {}
+
+    /**
+     * Deregisters an event listener on the line ripple element for a given event.
+     * @param {string} evtType
+     * @param {function(!Event): undefined} handler
+     */
+
+  }, {
+    key: "deregisterEventHandler",
+    value: function deregisterEventHandler(evtType, handler) {}
+  }]);
+
+  return MDCLineRippleAdapter;
+}();
+
+/* unused harmony default export */ var _unused_webpack_default_export = (MDCLineRippleAdapter);
+
+/***/ }),
+
+/***/ 141:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MDCTextField", function() { return MDCTextField; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_component__ = __webpack_require__(1);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__material_ripple_index__ = __webpack_require__(4);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__material_ripple_util__ = __webpack_require__(2);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__constants__ = __webpack_require__(64);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_4__adapter__ = __webpack_require__(65);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_5__foundation__ = __webpack_require__(144);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_6__material_line_ripple_index__ = __webpack_require__(22);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_7__helper_text_index__ = __webpack_require__(145);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_8__icon_index__ = __webpack_require__(146);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_9__material_floating_label_index__ = __webpack_require__(19);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_10__material_notched_outline_index__ = __webpack_require__(25);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCTextFieldFoundation", function() { return __WEBPACK_IMPORTED_MODULE_5__foundation__["a"]; });
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCTextFieldHelperText", function() { return __WEBPACK_IMPORTED_MODULE_7__helper_text_index__["a"]; });
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCTextFieldHelperTextFoundation", function() { return __WEBPACK_IMPORTED_MODULE_7__helper_text_index__["b"]; });
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCTextFieldIcon", function() { return __WEBPACK_IMPORTED_MODULE_8__icon_index__["a"]; });
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCTextFieldIconFoundation", function() { return __WEBPACK_IMPORTED_MODULE_8__icon_index__["b"]; });
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+var _get = function get(object, property, receiver) { if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { return get(parent, property, receiver); } } else if ("value" in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } };
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * @license
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+/* eslint-disable no-unused-vars */
+
+/* eslint-enable no-unused-vars */
+
+
+
+
+
+/* eslint-disable no-unused-vars */
+
+
+
+
+
+/* eslint-enable no-unused-vars */
+
+/**
+ * @extends {MDCComponent<!MDCTextFieldFoundation>}
+ * @final
+ */
+
+var MDCTextField = function (_MDCComponent) {
+  _inherits(MDCTextField, _MDCComponent);
+
+  /**
+   * @param {...?} args
+   */
+  function MDCTextField() {
+    var _ref;
+
+    _classCallCheck(this, MDCTextField);
+
+    for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    /** @private {?Element} */
+    var _this = _possibleConstructorReturn(this, (_ref = MDCTextField.__proto__ || Object.getPrototypeOf(MDCTextField)).call.apply(_ref, [this].concat(args)));
+
+    _this.input_;
+    /** @type {?MDCRipple} */
+    _this.ripple;
+    /** @private {?MDCLineRipple} */
+    _this.lineRipple_;
+    /** @private {?MDCTextFieldHelperText} */
+    _this.helperText_;
+    /** @private {?MDCTextFieldIcon} */
+    _this.icon_;
+    /** @private {?MDCFloatingLabel} */
+    _this.label_;
+    /** @private {?MDCNotchedOutline} */
+    _this.outline_;
+    return _this;
+  }
+
+  /**
+   * @param {!Element} root
+   * @return {!MDCTextField}
+   */
+
+
+  _createClass(MDCTextField, [{
+    key: 'initialize',
+
+
+    /**
+     * @param {(function(!Element): !MDCRipple)=} rippleFactory A function which
+     * creates a new MDCRipple.
+     * @param {(function(!Element): !MDCLineRipple)=} lineRippleFactory A function which
+     * creates a new MDCLineRipple.
+     * @param {(function(!Element): !MDCTextFieldHelperText)=} helperTextFactory A function which
+     * creates a new MDCTextFieldHelperText.
+     * @param {(function(!Element): !MDCTextFieldIcon)=} iconFactory A function which
+     * creates a new MDCTextFieldIcon.
+     * @param {(function(!Element): !MDCFloatingLabel)=} labelFactory A function which
+     * creates a new MDCFloatingLabel.
+     * @param {(function(!Element): !MDCNotchedOutline)=} outlineFactory A function which
+     * creates a new MDCNotchedOutline.
+     */
+    value: function initialize() {
+      var rippleFactory = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : function (el, foundation) {
+        return new __WEBPACK_IMPORTED_MODULE_1__material_ripple_index__["MDCRipple"](el, foundation);
+      };
+      var lineRippleFactory = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : function (el) {
+        return new __WEBPACK_IMPORTED_MODULE_6__material_line_ripple_index__["MDCLineRipple"](el);
+      };
+      var helperTextFactory = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : function (el) {
+        return new __WEBPACK_IMPORTED_MODULE_7__helper_text_index__["a" /* MDCTextFieldHelperText */](el);
+      };
+      var iconFactory = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : function (el) {
+        return new __WEBPACK_IMPORTED_MODULE_8__icon_index__["a" /* MDCTextFieldIcon */](el);
+      };
+
+      var _this2 = this;
+
+      var labelFactory = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : function (el) {
+        return new __WEBPACK_IMPORTED_MODULE_9__material_floating_label_index__["MDCFloatingLabel"](el);
+      };
+      var outlineFactory = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : function (el) {
+        return new __WEBPACK_IMPORTED_MODULE_10__material_notched_outline_index__["MDCNotchedOutline"](el);
+      };
+
+      this.input_ = this.root_.querySelector(__WEBPACK_IMPORTED_MODULE_3__constants__["d" /* strings */].INPUT_SELECTOR);
+      var labelElement = this.root_.querySelector(__WEBPACK_IMPORTED_MODULE_3__constants__["d" /* strings */].LABEL_SELECTOR);
+      if (labelElement) {
+        this.label_ = labelFactory(labelElement);
+      }
+      var lineRippleElement = this.root_.querySelector(__WEBPACK_IMPORTED_MODULE_3__constants__["d" /* strings */].LINE_RIPPLE_SELECTOR);
+      if (lineRippleElement) {
+        this.lineRipple_ = lineRippleFactory(lineRippleElement);
+      }
+      var outlineElement = this.root_.querySelector(__WEBPACK_IMPORTED_MODULE_3__constants__["d" /* strings */].OUTLINE_SELECTOR);
+      if (outlineElement) {
+        this.outline_ = outlineFactory(outlineElement);
+      }
+      if (this.input_.hasAttribute(__WEBPACK_IMPORTED_MODULE_3__constants__["d" /* strings */].ARIA_CONTROLS)) {
+        var helperTextElement = document.getElementById(this.input_.getAttribute(__WEBPACK_IMPORTED_MODULE_3__constants__["d" /* strings */].ARIA_CONTROLS));
+        if (helperTextElement) {
+          this.helperText_ = helperTextFactory(helperTextElement);
+        }
+      }
+      var iconElement = this.root_.querySelector(__WEBPACK_IMPORTED_MODULE_3__constants__["d" /* strings */].ICON_SELECTOR);
+      if (iconElement) {
+        this.icon_ = iconFactory(iconElement);
+      }
+
+      this.ripple = null;
+      if (this.root_.classList.contains(__WEBPACK_IMPORTED_MODULE_3__constants__["b" /* cssClasses */].BOX)) {
+        var MATCHES = Object(__WEBPACK_IMPORTED_MODULE_2__material_ripple_util__["getMatchesProperty"])(HTMLElement.prototype);
+        var adapter = _extends(__WEBPACK_IMPORTED_MODULE_1__material_ripple_index__["MDCRipple"].createAdapter( /** @type {!RippleCapableSurface} */this), {
+          isSurfaceActive: function isSurfaceActive() {
+            return _this2.input_[MATCHES](':active');
+          },
+          registerInteractionHandler: function registerInteractionHandler(type, handler) {
+            return _this2.input_.addEventListener(type, handler);
+          },
+          deregisterInteractionHandler: function deregisterInteractionHandler(type, handler) {
+            return _this2.input_.removeEventListener(type, handler);
+          }
+        });
+        var foundation = new __WEBPACK_IMPORTED_MODULE_1__material_ripple_index__["MDCRippleFoundation"](adapter);
+        this.ripple = rippleFactory(this.root_, foundation);
+      }
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      if (this.ripple) {
+        this.ripple.destroy();
+      }
+      if (this.lineRipple_) {
+        this.lineRipple_.destroy();
+      }
+      if (this.helperText_) {
+        this.helperText_.destroy();
+      }
+      if (this.icon_) {
+        this.icon_.destroy();
+      }
+      if (this.label_) {
+        this.label_.destroy();
+      }
+      if (this.outline_) {
+        this.outline_.destroy();
+      }
+      _get(MDCTextField.prototype.__proto__ || Object.getPrototypeOf(MDCTextField.prototype), 'destroy', this).call(this);
+    }
+
+    /**
+     * Initiliazes the Text Field's internal state based on the environment's
+     * state.
+     */
+
+  }, {
+    key: 'initialSyncWithDom',
+    value: function initialSyncWithDom() {
+      this.disabled = this.input_.disabled;
+    }
+
+    /**
+     * @return {string} The value of the input.
+     */
+
+  }, {
+    key: 'layout',
+
+
+    /**
+     * Recomputes the outline SVG path for the outline element.
+     */
+    value: function layout() {
+      var openNotch = this.foundation_.shouldFloat;
+      this.foundation_.notchOutline(openNotch);
+    }
+
+    /**
+     * @return {!MDCTextFieldFoundation}
+     */
+
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      var _this3 = this;
+
+      return new __WEBPACK_IMPORTED_MODULE_5__foundation__["a" /* default */](
+      /** @type {!MDCTextFieldAdapter} */_extends({
+        addClass: function addClass(className) {
+          return _this3.root_.classList.add(className);
+        },
+        removeClass: function removeClass(className) {
+          return _this3.root_.classList.remove(className);
+        },
+        hasClass: function hasClass(className) {
+          return _this3.root_.classList.contains(className);
+        },
+        registerTextFieldInteractionHandler: function registerTextFieldInteractionHandler(evtType, handler) {
+          return _this3.root_.addEventListener(evtType, handler);
+        },
+        deregisterTextFieldInteractionHandler: function deregisterTextFieldInteractionHandler(evtType, handler) {
+          return _this3.root_.removeEventListener(evtType, handler);
+        },
+        registerValidationAttributeChangeHandler: function registerValidationAttributeChangeHandler(handler) {
+          var getAttributesList = function getAttributesList(mutationsList) {
+            return mutationsList.map(function (mutation) {
+              return mutation.attributeName;
+            });
+          };
+          var observer = new MutationObserver(function (mutationsList) {
+            return handler(getAttributesList(mutationsList));
+          });
+          var targetNode = _this3.root_.querySelector(__WEBPACK_IMPORTED_MODULE_3__constants__["d" /* strings */].INPUT_SELECTOR);
+          var config = { attributes: true };
+          observer.observe(targetNode, config);
+          return observer;
+        },
+        deregisterValidationAttributeChangeHandler: function deregisterValidationAttributeChangeHandler(observer) {
+          return observer.disconnect();
+        },
+        isFocused: function isFocused() {
+          return document.activeElement === _this3.root_.querySelector(__WEBPACK_IMPORTED_MODULE_3__constants__["d" /* strings */].INPUT_SELECTOR);
+        },
+        isRtl: function isRtl() {
+          return window.getComputedStyle(_this3.root_).getPropertyValue('direction') === 'rtl';
+        }
+      }, this.getInputAdapterMethods_(), this.getLabelAdapterMethods_(), this.getLineRippleAdapterMethods_(), this.getOutlineAdapterMethods_()), this.getFoundationMap_());
+    }
+
+    /**
+     * @return {!{
+     *   shakeLabel: function(boolean): undefined,
+     *   floatLabel: function(boolean): undefined,
+     *   hasLabel: function(): boolean,
+     *   getLabelWidth: function(): number,
+     * }}
+     */
+
+  }, {
+    key: 'getLabelAdapterMethods_',
+    value: function getLabelAdapterMethods_() {
+      var _this4 = this;
+
+      return {
+        shakeLabel: function shakeLabel(shouldShake) {
+          return _this4.label_.shake(shouldShake);
+        },
+        floatLabel: function floatLabel(shouldFloat) {
+          return _this4.label_.float(shouldFloat);
+        },
+        hasLabel: function hasLabel() {
+          return !!_this4.label_;
+        },
+        getLabelWidth: function getLabelWidth() {
+          return _this4.label_.getWidth();
+        }
+      };
+    }
+
+    /**
+     * @return {!{
+     *   activateLineRipple: function(): undefined,
+     *   deactivateLineRipple: function(): undefined,
+     *   setLineRippleTransformOrigin: function(number): undefined,
+     * }}
+     */
+
+  }, {
+    key: 'getLineRippleAdapterMethods_',
+    value: function getLineRippleAdapterMethods_() {
+      var _this5 = this;
+
+      return {
+        activateLineRipple: function activateLineRipple() {
+          if (_this5.lineRipple_) {
+            _this5.lineRipple_.activate();
+          }
+        },
+        deactivateLineRipple: function deactivateLineRipple() {
+          if (_this5.lineRipple_) {
+            _this5.lineRipple_.deactivate();
+          }
+        },
+        setLineRippleTransformOrigin: function setLineRippleTransformOrigin(normalizedX) {
+          if (_this5.lineRipple_) {
+            _this5.lineRipple_.setRippleCenter(normalizedX);
+          }
+        }
+      };
+    }
+
+    /**
+     * @return {!{
+     *   notchOutline: function(number, boolean): undefined,
+     *   hasOutline: function(): boolean,
+     * }}
+     */
+
+  }, {
+    key: 'getOutlineAdapterMethods_',
+    value: function getOutlineAdapterMethods_() {
+      var _this6 = this;
+
+      return {
+        notchOutline: function notchOutline(labelWidth, isRtl) {
+          return _this6.outline_.notch(labelWidth, isRtl);
+        },
+        closeOutline: function closeOutline() {
+          return _this6.outline_.closeNotch();
+        },
+        hasOutline: function hasOutline() {
+          return !!_this6.outline_;
+        }
+      };
+    }
+
+    /**
+     * @return {!{
+     *   registerInputInteractionHandler: function(string, function()): undefined,
+     *   deregisterInputInteractionHandler: function(string, function()): undefined,
+     *   getNativeInput: function(): ?Element,
+     * }}
+     */
+
+  }, {
+    key: 'getInputAdapterMethods_',
+    value: function getInputAdapterMethods_() {
+      var _this7 = this;
+
+      return {
+        registerInputInteractionHandler: function registerInputInteractionHandler(evtType, handler) {
+          return _this7.input_.addEventListener(evtType, handler);
+        },
+        deregisterInputInteractionHandler: function deregisterInputInteractionHandler(evtType, handler) {
+          return _this7.input_.removeEventListener(evtType, handler);
+        },
+        getNativeInput: function getNativeInput() {
+          return _this7.input_;
+        }
+      };
+    }
+
+    /**
+     * Returns a map of all subcomponents to subfoundations.
+     * @return {!FoundationMapType}
+     */
+
+  }, {
+    key: 'getFoundationMap_',
+    value: function getFoundationMap_() {
+      return {
+        helperText: this.helperText_ ? this.helperText_.foundation : undefined,
+        icon: this.icon_ ? this.icon_.foundation : undefined
+      };
+    }
+  }, {
+    key: 'value',
+    get: function get() {
+      return this.foundation_.getValue();
+    }
+
+    /**
+     * @param {string} value The value to set on the input.
+     */
+    ,
+    set: function set(value) {
+      this.foundation_.setValue(value);
+    }
+
+    /**
+     * @return {boolean} True if the Text Field is disabled.
+     */
+
+  }, {
+    key: 'disabled',
+    get: function get() {
+      return this.foundation_.isDisabled();
+    }
+
+    /**
+     * @param {boolean} disabled Sets the Text Field disabled or enabled.
+     */
+    ,
+    set: function set(disabled) {
+      this.foundation_.setDisabled(disabled);
+    }
+
+    /**
+     * @return {boolean} valid True if the Text Field is valid.
+     */
+
+  }, {
+    key: 'valid',
+    get: function get() {
+      return this.foundation_.isValid();
+    }
+
+    /**
+     * @param {boolean} valid Sets the Text Field valid or invalid.
+     */
+    ,
+    set: function set(valid) {
+      this.foundation_.setValid(valid);
+    }
+
+    /**
+     * @return {boolean} True if the Text Field is required.
+     */
+
+  }, {
+    key: 'required',
+    get: function get() {
+      return this.input_.required;
+    }
+
+    /**
+     * @param {boolean} required Sets the Text Field to required.
+     */
+    ,
+    set: function set(required) {
+      this.input_.required = required;
+    }
+
+    /**
+     * @return {string} The input element's validation pattern.
+     */
+
+  }, {
+    key: 'pattern',
+    get: function get() {
+      return this.input_.pattern;
+    }
+
+    /**
+     * @param {string} pattern Sets the input element's validation pattern.
+     */
+    ,
+    set: function set(pattern) {
+      this.input_.pattern = pattern;
+    }
+
+    /**
+     * @return {number} The input element's minLength.
+     */
+
+  }, {
+    key: 'minLength',
+    get: function get() {
+      return this.input_.minLength;
+    }
+
+    /**
+     * @param {number} minLength Sets the input element's minLength.
+     */
+    ,
+    set: function set(minLength) {
+      this.input_.minLength = minLength;
+    }
+
+    /**
+     * @return {number} The input element's maxLength.
+     */
+
+  }, {
+    key: 'maxLength',
+    get: function get() {
+      return this.input_.maxLength;
+    }
+
+    /**
+     * @param {number} maxLength Sets the input element's maxLength.
+     */
+    ,
+    set: function set(maxLength) {
+      // Chrome throws exception if maxLength is set < 0
+      if (maxLength < 0) {
+        this.input_.removeAttribute('maxLength');
+      } else {
+        this.input_.maxLength = maxLength;
+      }
+    }
+
+    /**
+     * @return {string} The input element's min.
+     */
+
+  }, {
+    key: 'min',
+    get: function get() {
+      return this.input_.min;
+    }
+
+    /**
+     * @param {string} min Sets the input element's min.
+     */
+    ,
+    set: function set(min) {
+      this.input_.min = min;
+    }
+
+    /**
+     * @return {string} The input element's max.
+     */
+
+  }, {
+    key: 'max',
+    get: function get() {
+      return this.input_.max;
+    }
+
+    /**
+     * @param {string} max Sets the input element's max.
+     */
+    ,
+    set: function set(max) {
+      this.input_.max = max;
+    }
+
+    /**
+     * @return {string} The input element's step.
+     */
+
+  }, {
+    key: 'step',
+    get: function get() {
+      return this.input_.step;
+    }
+
+    /**
+     * @param {string} step Sets the input element's step.
+     */
+    ,
+    set: function set(step) {
+      this.input_.step = step;
+    }
+
+    /**
+     * Sets the helper text element content.
+     * @param {string} content
+     */
+
+  }, {
+    key: 'helperTextContent',
+    set: function set(content) {
+      this.foundation_.setHelperTextContent(content);
+    }
+
+    /**
+     * Sets the aria label of the icon.
+     * @param {string} label
+     */
+
+  }, {
+    key: 'iconAriaLabel',
+    set: function set(label) {
+      this.foundation_.setIconAriaLabel(label);
+    }
+
+    /**
+     * Sets the text content of the icon.
+     * @param {string} content
+     */
+
+  }, {
+    key: 'iconContent',
+    set: function set(content) {
+      this.foundation_.setIconContent(content);
+    }
+  }], [{
+    key: 'attachTo',
+    value: function attachTo(root) {
+      return new MDCTextField(root);
+    }
+  }]);
+
+  return MDCTextField;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_component__["a" /* default */]);
+
+
+
+/***/ }),
+
+/***/ 142:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return strings; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return cssClasses; });
+/**
+ * @license
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/** @enum {string} */
+var strings = {
+  ARIA_HIDDEN: 'aria-hidden',
+  ROLE: 'role'
+};
+
+/** @enum {string} */
+var cssClasses = {
+  HELPER_TEXT_PERSISTENT: 'mdc-text-field-helper-text--persistent',
+  HELPER_TEXT_VALIDATION_MSG: 'mdc-text-field-helper-text--validation-msg'
+};
+
+
+
+/***/ }),
+
+/***/ 143:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return strings; });
+/**
+ * @license
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/** @enum {string} */
+var strings = {
+  ICON_EVENT: 'MDCTextField:icon',
+  ICON_ROLE: 'button'
+};
+
+
+
+/***/ }),
+
+/***/ 144:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_foundation__ = __webpack_require__(0);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__helper_text_foundation__ = __webpack_require__(47);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__icon_foundation__ = __webpack_require__(48);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__adapter__ = __webpack_require__(65);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_4__constants__ = __webpack_require__(64);
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * @license
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+/* eslint-disable no-unused-vars */
+
+
+/* eslint-enable no-unused-vars */
+
+
+
+/**
+ * @extends {MDCFoundation<!MDCTextFieldAdapter>}
+ * @final
+ */
+
+var MDCTextFieldFoundation = function (_MDCFoundation) {
+  _inherits(MDCTextFieldFoundation, _MDCFoundation);
+
+  _createClass(MDCTextFieldFoundation, [{
+    key: 'shouldShake',
+
+
+    /** @return {boolean} */
+    get: function get() {
+      return !this.isValid() && !this.isFocused_;
+    }
+
+    /** @return {boolean} */
+
+  }, {
+    key: 'shouldFloat',
+    get: function get() {
+      return this.isFocused_ || !!this.getValue() || this.isBadInput_();
+    }
+
+    /**
+     * {@see MDCTextFieldAdapter} for typing information on parameters and return
+     * types.
+     * @return {!MDCTextFieldAdapter}
+     */
+
+  }], [{
+    key: 'cssClasses',
+
+    /** @return enum {string} */
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_4__constants__["b" /* cssClasses */];
+    }
+
+    /** @return enum {string} */
+
+  }, {
+    key: 'strings',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_4__constants__["d" /* strings */];
+    }
+
+    /** @return enum {string} */
+
+  }, {
+    key: 'numbers',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_4__constants__["c" /* numbers */];
+    }
+  }, {
+    key: 'defaultAdapter',
+    get: function get() {
+      return (/** @type {!MDCTextFieldAdapter} */{
+          addClass: function addClass() {},
+          removeClass: function removeClass() {},
+          hasClass: function hasClass() {},
+          registerTextFieldInteractionHandler: function registerTextFieldInteractionHandler() {},
+          deregisterTextFieldInteractionHandler: function deregisterTextFieldInteractionHandler() {},
+          registerInputInteractionHandler: function registerInputInteractionHandler() {},
+          deregisterInputInteractionHandler: function deregisterInputInteractionHandler() {},
+          registerValidationAttributeChangeHandler: function registerValidationAttributeChangeHandler() {},
+          deregisterValidationAttributeChangeHandler: function deregisterValidationAttributeChangeHandler() {},
+          getNativeInput: function getNativeInput() {},
+          isFocused: function isFocused() {},
+          isRtl: function isRtl() {},
+          activateLineRipple: function activateLineRipple() {},
+          deactivateLineRipple: function deactivateLineRipple() {},
+          setLineRippleTransformOrigin: function setLineRippleTransformOrigin() {},
+          shakeLabel: function shakeLabel() {},
+          floatLabel: function floatLabel() {},
+          hasLabel: function hasLabel() {},
+          getLabelWidth: function getLabelWidth() {},
+          hasOutline: function hasOutline() {},
+          notchOutline: function notchOutline() {},
+          closeOutline: function closeOutline() {}
+        }
+      );
+    }
+
+    /**
+     * @param {!MDCTextFieldAdapter} adapter
+     * @param {!FoundationMapType=} foundationMap Map from subcomponent names to their subfoundations.
+     */
+
+  }]);
+
+  function MDCTextFieldFoundation(adapter) {
+    var foundationMap = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : /** @type {!FoundationMapType} */{};
+
+    _classCallCheck(this, MDCTextFieldFoundation);
+
+    /** @type {!MDCTextFieldHelperTextFoundation|undefined} */
+    var _this = _possibleConstructorReturn(this, (MDCTextFieldFoundation.__proto__ || Object.getPrototypeOf(MDCTextFieldFoundation)).call(this, _extends(MDCTextFieldFoundation.defaultAdapter, adapter)));
+
+    _this.helperText_ = foundationMap.helperText;
+    /** @type {!MDCTextFieldIconFoundation|undefined} */
+    _this.icon_ = foundationMap.icon;
+
+    /** @private {boolean} */
+    _this.isFocused_ = false;
+    /** @private {boolean} */
+    _this.receivedUserInput_ = false;
+    /** @private {boolean} */
+    _this.useCustomValidityChecking_ = false;
+    /** @private {boolean} */
+    _this.isValid_ = true;
+    /** @private {function(): undefined} */
+    _this.inputFocusHandler_ = function () {
+      return _this.activateFocus();
+    };
+    /** @private {function(): undefined} */
+    _this.inputBlurHandler_ = function () {
+      return _this.deactivateFocus();
+    };
+    /** @private {function(): undefined} */
+    _this.inputInputHandler_ = function () {
+      return _this.autoCompleteFocus();
+    };
+    /** @private {function(!Event): undefined} */
+    _this.setPointerXOffset_ = function (evt) {
+      return _this.setTransformOrigin(evt);
+    };
+    /** @private {function(!Event): undefined} */
+    _this.textFieldInteractionHandler_ = function () {
+      return _this.handleTextFieldInteraction();
+    };
+    /** @private {function(!Array): undefined} */
+    _this.validationAttributeChangeHandler_ = function (attributesList) {
+      return _this.handleValidationAttributeChange(attributesList);
+    };
+
+    /** @private {!MutationObserver} */
+    _this.validationObserver_;
+    return _this;
+  }
+
+  _createClass(MDCTextFieldFoundation, [{
+    key: 'init',
+    value: function init() {
+      var _this2 = this;
+
+      this.adapter_.addClass(MDCTextFieldFoundation.cssClasses.UPGRADED);
+      // Ensure label does not collide with any pre-filled value.
+      if (this.adapter_.hasLabel() && (this.getValue() || this.isBadInput_())) {
+        this.adapter_.floatLabel(this.shouldFloat);
+        this.notchOutline(this.shouldFloat);
+      }
+
+      if (this.adapter_.isFocused()) {
+        this.inputFocusHandler_();
+      }
+
+      this.adapter_.registerInputInteractionHandler('focus', this.inputFocusHandler_);
+      this.adapter_.registerInputInteractionHandler('blur', this.inputBlurHandler_);
+      this.adapter_.registerInputInteractionHandler('input', this.inputInputHandler_);
+      ['mousedown', 'touchstart'].forEach(function (evtType) {
+        _this2.adapter_.registerInputInteractionHandler(evtType, _this2.setPointerXOffset_);
+      });
+      ['click', 'keydown'].forEach(function (evtType) {
+        _this2.adapter_.registerTextFieldInteractionHandler(evtType, _this2.textFieldInteractionHandler_);
+      });
+      this.validationObserver_ = this.adapter_.registerValidationAttributeChangeHandler(this.validationAttributeChangeHandler_);
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      var _this3 = this;
+
+      this.adapter_.removeClass(MDCTextFieldFoundation.cssClasses.UPGRADED);
+      this.adapter_.deregisterInputInteractionHandler('focus', this.inputFocusHandler_);
+      this.adapter_.deregisterInputInteractionHandler('blur', this.inputBlurHandler_);
+      this.adapter_.deregisterInputInteractionHandler('input', this.inputInputHandler_);
+      ['mousedown', 'touchstart'].forEach(function (evtType) {
+        _this3.adapter_.deregisterInputInteractionHandler(evtType, _this3.setPointerXOffset_);
+      });
+      ['click', 'keydown'].forEach(function (evtType) {
+        _this3.adapter_.deregisterTextFieldInteractionHandler(evtType, _this3.textFieldInteractionHandler_);
+      });
+      this.adapter_.deregisterValidationAttributeChangeHandler(this.validationObserver_);
+    }
+
+    /**
+     * Handles user interactions with the Text Field.
+     */
+
+  }, {
+    key: 'handleTextFieldInteraction',
+    value: function handleTextFieldInteraction() {
+      if (this.adapter_.getNativeInput().disabled) {
+        return;
+      }
+      this.receivedUserInput_ = true;
+    }
+
+    /**
+     * Handles validation attribute changes
+     * @param {!Array<string>} attributesList
+     */
+
+  }, {
+    key: 'handleValidationAttributeChange',
+    value: function handleValidationAttributeChange(attributesList) {
+      var _this4 = this;
+
+      attributesList.some(function (attributeName) {
+        if (__WEBPACK_IMPORTED_MODULE_4__constants__["a" /* VALIDATION_ATTR_WHITELIST */].indexOf(attributeName) > -1) {
+          _this4.styleValidity_(true);
+          return true;
+        }
+      });
+    }
+
+    /**
+     * Opens/closes the notched outline.
+     * @param {boolean} openNotch
+     */
+
+  }, {
+    key: 'notchOutline',
+    value: function notchOutline(openNotch) {
+      if (!this.adapter_.hasOutline() || !this.adapter_.hasLabel()) {
+        return;
+      }
+
+      if (openNotch) {
+        var isDense = this.adapter_.hasClass(__WEBPACK_IMPORTED_MODULE_4__constants__["b" /* cssClasses */].DENSE);
+        var labelScale = isDense ? __WEBPACK_IMPORTED_MODULE_4__constants__["c" /* numbers */].DENSE_LABEL_SCALE : __WEBPACK_IMPORTED_MODULE_4__constants__["c" /* numbers */].LABEL_SCALE;
+        var labelWidth = this.adapter_.getLabelWidth() * labelScale;
+        var isRtl = this.adapter_.isRtl();
+        this.adapter_.notchOutline(labelWidth, isRtl);
+      } else {
+        this.adapter_.closeOutline();
+      }
+    }
+
+    /**
+     * Activates the text field focus state.
+     */
+
+  }, {
+    key: 'activateFocus',
+    value: function activateFocus() {
+      this.isFocused_ = true;
+      this.styleFocused_(this.isFocused_);
+      this.adapter_.activateLineRipple();
+      this.notchOutline(this.shouldFloat);
+      if (this.adapter_.hasLabel()) {
+        this.adapter_.shakeLabel(this.shouldShake);
+        this.adapter_.floatLabel(this.shouldFloat);
+      }
+      if (this.helperText_) {
+        this.helperText_.showToScreenReader();
+      }
+    }
+
+    /**
+     * Sets the line ripple's transform origin, so that the line ripple activate
+     * animation will animate out from the user's click location.
+     * @param {!Event} evt
+     */
+
+  }, {
+    key: 'setTransformOrigin',
+    value: function setTransformOrigin(evt) {
+      var targetClientRect = evt.target.getBoundingClientRect();
+      var evtCoords = { x: evt.clientX, y: evt.clientY };
+      var normalizedX = evtCoords.x - targetClientRect.left;
+      this.adapter_.setLineRippleTransformOrigin(normalizedX);
+    }
+
+    /**
+     * Activates the Text Field's focus state in cases when the input value
+     * changes without user input (e.g. programatically).
+     */
+
+  }, {
+    key: 'autoCompleteFocus',
+    value: function autoCompleteFocus() {
+      if (!this.receivedUserInput_) {
+        this.activateFocus();
+      }
+    }
+
+    /**
+     * Deactivates the Text Field's focus state.
+     */
+
+  }, {
+    key: 'deactivateFocus',
+    value: function deactivateFocus() {
+      this.isFocused_ = false;
+      this.adapter_.deactivateLineRipple();
+      var input = this.getNativeInput_();
+      var shouldRemoveLabelFloat = !input.value && !this.isBadInput_();
+      var isValid = this.isValid();
+      this.styleValidity_(isValid);
+      this.styleFocused_(this.isFocused_);
+      if (this.adapter_.hasLabel()) {
+        this.adapter_.shakeLabel(this.shouldShake);
+        this.adapter_.floatLabel(this.shouldFloat);
+        this.notchOutline(this.shouldFloat);
+      }
+      if (shouldRemoveLabelFloat) {
+        this.receivedUserInput_ = false;
+      }
+    }
+
+    /**
+     * @return {string} The value of the input Element.
+     */
+
+  }, {
+    key: 'getValue',
+    value: function getValue() {
+      return this.getNativeInput_().value;
+    }
+
+    /**
+     * @param {string} value The value to set on the input Element.
+     */
+
+  }, {
+    key: 'setValue',
+    value: function setValue(value) {
+      this.getNativeInput_().value = value;
+      var isValid = this.isValid();
+      this.styleValidity_(isValid);
+      if (this.adapter_.hasLabel()) {
+        this.adapter_.shakeLabel(this.shouldShake);
+        this.adapter_.floatLabel(this.shouldFloat);
+        this.notchOutline(this.shouldFloat);
+      }
+    }
+
+    /**
+     * @return {boolean} If a custom validity is set, returns that value.
+     *     Otherwise, returns the result of native validity checks.
+     */
+
+  }, {
+    key: 'isValid',
+    value: function isValid() {
+      return this.useCustomValidityChecking_ ? this.isValid_ : this.isNativeInputValid_();
+    }
+
+    /**
+     * @param {boolean} isValid Sets the validity state of the Text Field.
+     */
+
+  }, {
+    key: 'setValid',
+    value: function setValid(isValid) {
+      this.useCustomValidityChecking_ = true;
+      this.isValid_ = isValid;
+      // Retrieve from the getter to ensure correct logic is applied.
+      isValid = this.isValid();
+      this.styleValidity_(isValid);
+      if (this.adapter_.hasLabel()) {
+        this.adapter_.shakeLabel(this.shouldShake);
+      }
+    }
+
+    /**
+     * @return {boolean} True if the Text Field is disabled.
+     */
+
+  }, {
+    key: 'isDisabled',
+    value: function isDisabled() {
+      return this.getNativeInput_().disabled;
+    }
+
+    /**
+     * @param {boolean} disabled Sets the text-field disabled or enabled.
+     */
+
+  }, {
+    key: 'setDisabled',
+    value: function setDisabled(disabled) {
+      this.getNativeInput_().disabled = disabled;
+      this.styleDisabled_(disabled);
+    }
+
+    /**
+     * @param {string} content Sets the content of the helper text.
+     */
+
+  }, {
+    key: 'setHelperTextContent',
+    value: function setHelperTextContent(content) {
+      if (this.helperText_) {
+        this.helperText_.setContent(content);
+      }
+    }
+
+    /**
+     * Sets the aria label of the icon.
+     * @param {string} label
+     */
+
+  }, {
+    key: 'setIconAriaLabel',
+    value: function setIconAriaLabel(label) {
+      if (this.icon_) {
+        this.icon_.setAriaLabel(label);
+      }
+    }
+
+    /**
+     * Sets the text content of the icon.
+     * @param {string} content
+     */
+
+  }, {
+    key: 'setIconContent',
+    value: function setIconContent(content) {
+      if (this.icon_) {
+        this.icon_.setContent(content);
+      }
+    }
+
+    /**
+     * @return {boolean} True if the Text Field input fails in converting the
+     *     user-supplied value.
+     * @private
+     */
+
+  }, {
+    key: 'isBadInput_',
+    value: function isBadInput_() {
+      return this.getNativeInput_().validity.badInput;
+    }
+
+    /**
+     * @return {boolean} The result of native validity checking
+     *     (ValidityState.valid).
+     */
+
+  }, {
+    key: 'isNativeInputValid_',
+    value: function isNativeInputValid_() {
+      return this.getNativeInput_().validity.valid;
+    }
+
+    /**
+     * Styles the component based on the validity state.
+     * @param {boolean} isValid
+     * @private
+     */
+
+  }, {
+    key: 'styleValidity_',
+    value: function styleValidity_(isValid) {
+      var INVALID = MDCTextFieldFoundation.cssClasses.INVALID;
+
+      if (isValid) {
+        this.adapter_.removeClass(INVALID);
+      } else {
+        this.adapter_.addClass(INVALID);
+      }
+      if (this.helperText_) {
+        this.helperText_.setValidity(isValid);
+      }
+    }
+
+    /**
+     * Styles the component based on the focused state.
+     * @param {boolean} isFocused
+     * @private
+     */
+
+  }, {
+    key: 'styleFocused_',
+    value: function styleFocused_(isFocused) {
+      var FOCUSED = MDCTextFieldFoundation.cssClasses.FOCUSED;
+
+      if (isFocused) {
+        this.adapter_.addClass(FOCUSED);
+      } else {
+        this.adapter_.removeClass(FOCUSED);
+      }
+    }
+
+    /**
+     * Styles the component based on the disabled state.
+     * @param {boolean} isDisabled
+     * @private
+     */
+
+  }, {
+    key: 'styleDisabled_',
+    value: function styleDisabled_(isDisabled) {
+      var _MDCTextFieldFoundati = MDCTextFieldFoundation.cssClasses,
+          DISABLED = _MDCTextFieldFoundati.DISABLED,
+          INVALID = _MDCTextFieldFoundati.INVALID;
+
+      if (isDisabled) {
+        this.adapter_.addClass(DISABLED);
+        this.adapter_.removeClass(INVALID);
+      } else {
+        this.adapter_.removeClass(DISABLED);
+      }
+      if (this.icon_) {
+        this.icon_.setDisabled(isDisabled);
+      }
+    }
+
+    /**
+     * @return {!Element|!NativeInputType} The native text input from the
+     * host environment, or a dummy if none exists.
+     * @private
+     */
+
+  }, {
+    key: 'getNativeInput_',
+    value: function getNativeInput_() {
+      return this.adapter_.getNativeInput() ||
+      /** @type {!NativeInputType} */{
+        value: '',
+        disabled: false,
+        validity: {
+          badInput: false,
+          valid: true
+        }
+      };
+    }
+  }]);
+
+  return MDCTextFieldFoundation;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_foundation__["a" /* default */]);
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCTextFieldFoundation);
+
+/***/ }),
+
+/***/ 145:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return MDCTextFieldHelperText; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_component__ = __webpack_require__(1);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__adapter__ = __webpack_require__(66);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__foundation__ = __webpack_require__(47);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return __WEBPACK_IMPORTED_MODULE_2__foundation__["a"]; });
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * @license
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+/**
+ * @extends {MDCComponent<!MDCTextFieldHelperTextFoundation>}
+ * @final
+ */
+
+var MDCTextFieldHelperText = function (_MDCComponent) {
+  _inherits(MDCTextFieldHelperText, _MDCComponent);
+
+  function MDCTextFieldHelperText() {
+    _classCallCheck(this, MDCTextFieldHelperText);
+
+    return _possibleConstructorReturn(this, (MDCTextFieldHelperText.__proto__ || Object.getPrototypeOf(MDCTextFieldHelperText)).apply(this, arguments));
+  }
+
+  _createClass(MDCTextFieldHelperText, [{
+    key: 'getDefaultFoundation',
+
+
+    /**
+     * @return {!MDCTextFieldHelperTextFoundation}
+     */
+    value: function getDefaultFoundation() {
+      var _this2 = this;
+
+      return new __WEBPACK_IMPORTED_MODULE_2__foundation__["a" /* default */]( /** @type {!MDCTextFieldHelperTextAdapter} */_extends({
+        addClass: function addClass(className) {
+          return _this2.root_.classList.add(className);
+        },
+        removeClass: function removeClass(className) {
+          return _this2.root_.classList.remove(className);
+        },
+        hasClass: function hasClass(className) {
+          return _this2.root_.classList.contains(className);
+        },
+        setAttr: function setAttr(attr, value) {
+          return _this2.root_.setAttribute(attr, value);
+        },
+        removeAttr: function removeAttr(attr) {
+          return _this2.root_.removeAttribute(attr);
+        },
+        setContent: function setContent(content) {
+          _this2.root_.textContent = content;
+        }
+      }));
+    }
+  }, {
+    key: 'foundation',
+
+
+    /**
+     * @return {!MDCTextFieldHelperTextFoundation}
+     */
+    get: function get() {
+      return this.foundation_;
+    }
+  }], [{
+    key: 'attachTo',
+
+    /**
+     * @param {!Element} root
+     * @return {!MDCTextFieldHelperText}
+     */
+    value: function attachTo(root) {
+      return new MDCTextFieldHelperText(root);
+    }
+  }]);
+
+  return MDCTextFieldHelperText;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_component__["a" /* default */]);
+
+
+
+/***/ }),
+
+/***/ 146:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return MDCTextFieldIcon; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_component__ = __webpack_require__(1);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__adapter__ = __webpack_require__(67);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__foundation__ = __webpack_require__(48);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return __WEBPACK_IMPORTED_MODULE_2__foundation__["a"]; });
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * @license
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+/**
+ * @extends {MDCComponent<!MDCTextFieldIconFoundation>}
+ * @final
+ */
+
+var MDCTextFieldIcon = function (_MDCComponent) {
+  _inherits(MDCTextFieldIcon, _MDCComponent);
+
+  function MDCTextFieldIcon() {
+    _classCallCheck(this, MDCTextFieldIcon);
+
+    return _possibleConstructorReturn(this, (MDCTextFieldIcon.__proto__ || Object.getPrototypeOf(MDCTextFieldIcon)).apply(this, arguments));
+  }
+
+  _createClass(MDCTextFieldIcon, [{
+    key: 'getDefaultFoundation',
+
+
+    /**
+     * @return {!MDCTextFieldIconFoundation}
+     */
+    value: function getDefaultFoundation() {
+      var _this2 = this;
+
+      return new __WEBPACK_IMPORTED_MODULE_2__foundation__["a" /* default */]( /** @type {!MDCTextFieldIconAdapter} */_extends({
+        getAttr: function getAttr(attr) {
+          return _this2.root_.getAttribute(attr);
+        },
+        setAttr: function setAttr(attr, value) {
+          return _this2.root_.setAttribute(attr, value);
+        },
+        removeAttr: function removeAttr(attr) {
+          return _this2.root_.removeAttribute(attr);
+        },
+        setContent: function setContent(content) {
+          _this2.root_.textContent = content;
+        },
+        registerInteractionHandler: function registerInteractionHandler(evtType, handler) {
+          return _this2.root_.addEventListener(evtType, handler);
+        },
+        deregisterInteractionHandler: function deregisterInteractionHandler(evtType, handler) {
+          return _this2.root_.removeEventListener(evtType, handler);
+        },
+        notifyIconAction: function notifyIconAction() {
+          return _this2.emit(__WEBPACK_IMPORTED_MODULE_2__foundation__["a" /* default */].strings.ICON_EVENT, {} /* evtData */, true /* shouldBubble */);
+        }
+      }));
+    }
+  }, {
+    key: 'foundation',
+
+
+    /**
+     * @return {!MDCTextFieldIconFoundation}
+     */
+    get: function get() {
+      return this.foundation_;
+    }
+  }], [{
+    key: 'attachTo',
+
+    /**
+     * @param {!Element} root
+     * @return {!MDCTextFieldIcon}
+     */
+    value: function attachTo(root) {
+      return new MDCTextFieldIcon(root);
+    }
+  }]);
+
+  return MDCTextFieldIcon;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_component__["a" /* default */]);
+
+
+
+/***/ }),
+
+/***/ 15:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * @license
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/* eslint no-unused-vars: [2, {"args": "none"}] */
+
+/**
+ * Adapter for MDC Notched Outline.
+ *
+ * Defines the shape of the adapter expected by the foundation. Implement this
+ * adapter to integrate the Notched Outline into your framework. See
+ * https://github.com/material-components/material-components-web/blob/master/docs/authoring-components.md
+ * for more information.
+ *
+ * @record
+ */
+var MDCNotchedOutlineAdapter = function () {
+  function MDCNotchedOutlineAdapter() {
+    _classCallCheck(this, MDCNotchedOutlineAdapter);
+  }
+
+  _createClass(MDCNotchedOutlineAdapter, [{
+    key: "getWidth",
+
+    /**
+     * Returns the width of the root element.
+     * @return {number}
+     */
+    value: function getWidth() {}
+
+    /**
+     * Returns the height of the root element.
+     * @return {number}
+     */
+
+  }, {
+    key: "getHeight",
+    value: function getHeight() {}
+
+    /**
+     * Adds a class to the root element.
+     * @param {string} className
+     */
+
+  }, {
+    key: "addClass",
+    value: function addClass(className) {}
+
+    /**
+     * Removes a class from the root element.
+     * @param {string} className
+     */
+
+  }, {
+    key: "removeClass",
+    value: function removeClass(className) {}
+
+    /**
+     * Sets the "d" attribute of the outline element's SVG path.
+     * @param {string} value
+     */
+
+  }, {
+    key: "setOutlinePathAttr",
+    value: function setOutlinePathAttr(value) {}
+
+    /**
+     * Returns the idle outline element's computed style value of the given css property `propertyName`.
+     * We achieve this via `getComputedStyle(...).getPropertyValue(propertyName)`.
+     * @param {string} propertyName
+     * @return {string}
+     */
+
+  }, {
+    key: "getIdleOutlineStyleValue",
+    value: function getIdleOutlineStyleValue(propertyName) {}
+  }]);
+
+  return MDCNotchedOutlineAdapter;
+}();
+
+/* unused harmony default export */ var _unused_webpack_default_export = (MDCNotchedOutlineAdapter);
+
+/***/ }),
+
+/***/ 16:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return cssClasses; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return strings; });
+/**
+ * @license
+ * Copyright 2018 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/** @enum {string} */
+var strings = {
+  PATH_SELECTOR: '.mdc-notched-outline__path',
+  IDLE_OUTLINE_SELECTOR: '.mdc-notched-outline__idle'
+};
+
+/** @enum {string} */
+var cssClasses = {
+  OUTLINE_NOTCHED: 'mdc-notched-outline--notched'
+};
+
+
+
+/***/ }),
+
+/***/ 19:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MDCFloatingLabel", function() { return MDCFloatingLabel; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_component__ = __webpack_require__(1);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__adapter__ = __webpack_require__(13);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__foundation__ = __webpack_require__(20);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCFloatingLabelFoundation", function() { return __WEBPACK_IMPORTED_MODULE_2__foundation__["a"]; });
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * @license
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+/**
+ * @extends {MDCComponent<!MDCFloatingLabelFoundation>}
+ * @final
+ */
+
+var MDCFloatingLabel = function (_MDCComponent) {
+  _inherits(MDCFloatingLabel, _MDCComponent);
+
+  function MDCFloatingLabel() {
+    _classCallCheck(this, MDCFloatingLabel);
+
+    return _possibleConstructorReturn(this, (MDCFloatingLabel.__proto__ || Object.getPrototypeOf(MDCFloatingLabel)).apply(this, arguments));
+  }
+
+  _createClass(MDCFloatingLabel, [{
+    key: 'shake',
+
+
+    /**
+     * Styles the label to produce the label shake for errors.
+     * @param {boolean} shouldShake styles the label to shake by adding shake class
+     * if true, otherwise will stop shaking by removing shake class.
+     */
+    value: function shake(shouldShake) {
+      this.foundation_.shake(shouldShake);
+    }
+
+    /**
+     * Styles label to float/dock.
+     * @param {boolean} shouldFloat styles the label to float by adding float class
+     * if true, otherwise docks the label by removing the float class.
+     */
+
+  }, {
+    key: 'float',
+    value: function float(shouldFloat) {
+      this.foundation_.float(shouldFloat);
+    }
+
+    /**
+     * @return {number}
+     */
+
+  }, {
+    key: 'getWidth',
+    value: function getWidth() {
+      return this.foundation_.getWidth();
+    }
+
+    /**
+     * @return {!MDCFloatingLabelFoundation}
+     */
+
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      var _this2 = this;
+
+      return new __WEBPACK_IMPORTED_MODULE_2__foundation__["a" /* default */]({
+        addClass: function addClass(className) {
+          return _this2.root_.classList.add(className);
+        },
+        removeClass: function removeClass(className) {
+          return _this2.root_.classList.remove(className);
+        },
+        getWidth: function getWidth() {
+          return _this2.root_.offsetWidth;
+        },
+        registerInteractionHandler: function registerInteractionHandler(evtType, handler) {
+          return _this2.root_.addEventListener(evtType, handler);
+        },
+        deregisterInteractionHandler: function deregisterInteractionHandler(evtType, handler) {
+          return _this2.root_.removeEventListener(evtType, handler);
+        }
+      });
+    }
+  }], [{
+    key: 'attachTo',
+
+    /**
+     * @param {!Element} root
+     * @return {!MDCFloatingLabel}
+     */
+    value: function attachTo(root) {
+      return new MDCFloatingLabel(root);
+    }
+  }]);
+
+  return MDCFloatingLabel;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_component__["a" /* default */]);
+
+
+
+/***/ }),
+
+/***/ 2:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "supportsCssVariables", function() { return supportsCssVariables; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "applyPassive", function() { return applyPassive; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "getMatchesProperty", function() { return getMatchesProperty; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "getNormalizedEventCoords", function() { return getNormalizedEventCoords; });
+/**
+ * @license
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * Stores result from supportsCssVariables to avoid redundant processing to detect CSS custom variable support.
+ * @private {boolean|undefined}
+ */
+var supportsCssVariables_ = void 0;
+
+/**
+ * Stores result from applyPassive to avoid redundant processing to detect passive event listener support.
+ * @private {boolean|undefined}
+ */
+var supportsPassive_ = void 0;
+
+/**
+ * @param {!Window} windowObj
+ * @return {boolean}
+ */
+function detectEdgePseudoVarBug(windowObj) {
+  // Detect versions of Edge with buggy var() support
+  // See: https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/11495448/
+  var document = windowObj.document;
+  var node = document.createElement('div');
+  node.className = 'mdc-ripple-surface--test-edge-var-bug';
+  document.body.appendChild(node);
+
+  // The bug exists if ::before style ends up propagating to the parent element.
+  // Additionally, getComputedStyle returns null in iframes with display: "none" in Firefox,
+  // but Firefox is known to support CSS custom properties correctly.
+  // See: https://bugzilla.mozilla.org/show_bug.cgi?id=548397
+  var computedStyle = windowObj.getComputedStyle(node);
+  var hasPseudoVarBug = computedStyle !== null && computedStyle.borderTopStyle === 'solid';
+  node.remove();
+  return hasPseudoVarBug;
+}
+
+/**
+ * @param {!Window} windowObj
+ * @param {boolean=} forceRefresh
+ * @return {boolean|undefined}
+ */
+
+function supportsCssVariables(windowObj) {
+  var forceRefresh = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+
+  var supportsCssVariables = supportsCssVariables_;
+  if (typeof supportsCssVariables_ === 'boolean' && !forceRefresh) {
+    return supportsCssVariables;
+  }
+
+  var supportsFunctionPresent = windowObj.CSS && typeof windowObj.CSS.supports === 'function';
+  if (!supportsFunctionPresent) {
+    return;
+  }
+
+  var explicitlySupportsCssVars = windowObj.CSS.supports('--css-vars', 'yes');
+  // See: https://bugs.webkit.org/show_bug.cgi?id=154669
+  // See: README section on Safari
+  var weAreFeatureDetectingSafari10plus = windowObj.CSS.supports('(--css-vars: yes)') && windowObj.CSS.supports('color', '#00000000');
+
+  if (explicitlySupportsCssVars || weAreFeatureDetectingSafari10plus) {
+    supportsCssVariables = !detectEdgePseudoVarBug(windowObj);
+  } else {
+    supportsCssVariables = false;
+  }
+
+  if (!forceRefresh) {
+    supportsCssVariables_ = supportsCssVariables;
+  }
+  return supportsCssVariables;
+}
+
+//
+/**
+ * Determine whether the current browser supports passive event listeners, and if so, use them.
+ * @param {!Window=} globalObj
+ * @param {boolean=} forceRefresh
+ * @return {boolean|{passive: boolean}}
+ */
+function applyPassive() {
+  var globalObj = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : window;
+  var forceRefresh = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+
+  if (supportsPassive_ === undefined || forceRefresh) {
+    var isSupported = false;
+    try {
+      globalObj.document.addEventListener('test', null, { get passive() {
+          isSupported = true;
+        } });
+    } catch (e) {}
+
+    supportsPassive_ = isSupported;
+  }
+
+  return supportsPassive_ ? { passive: true } : false;
+}
+
+/**
+ * @param {!Object} HTMLElementPrototype
+ * @return {!Array<string>}
+ */
+function getMatchesProperty(HTMLElementPrototype) {
+  return ['webkitMatchesSelector', 'msMatchesSelector', 'matches'].filter(function (p) {
+    return p in HTMLElementPrototype;
+  }).pop();
+}
+
+/**
+ * @param {!Event} ev
+ * @param {{x: number, y: number}} pageOffset
+ * @param {!ClientRect} clientRect
+ * @return {{x: number, y: number}}
+ */
+function getNormalizedEventCoords(ev, pageOffset, clientRect) {
+  var x = pageOffset.x,
+      y = pageOffset.y;
+
+  var documentX = x + clientRect.left;
+  var documentY = y + clientRect.top;
+
+  var normalizedX = void 0;
+  var normalizedY = void 0;
+  // Determine touch point relative to the ripple container.
+  if (ev.type === 'touchstart') {
+    normalizedX = ev.changedTouches[0].pageX - documentX;
+    normalizedY = ev.changedTouches[0].pageY - documentY;
+  } else {
+    normalizedX = ev.pageX - documentX;
+    normalizedY = ev.pageY - documentY;
+  }
+
+  return { x: normalizedX, y: normalizedY };
+}
+
+
+
+/***/ }),
+
+/***/ 20:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_foundation__ = __webpack_require__(0);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__adapter__ = __webpack_require__(13);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__constants__ = __webpack_require__(21);
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * @license
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+/**
+ * @extends {MDCFoundation<!MDCFloatingLabelAdapter>}
+ * @final
+ */
+
+var MDCFloatingLabelFoundation = function (_MDCFoundation) {
+  _inherits(MDCFloatingLabelFoundation, _MDCFoundation);
+
+  _createClass(MDCFloatingLabelFoundation, null, [{
+    key: 'cssClasses',
+
+    /** @return enum {string} */
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */];
+    }
+
+    /**
+     * {@see MDCFloatingLabelAdapter} for typing information on parameters and return
+     * types.
+     * @return {!MDCFloatingLabelAdapter}
+     */
+
+  }, {
+    key: 'defaultAdapter',
+    get: function get() {
+      return (/** @type {!MDCFloatingLabelAdapter} */{
+          addClass: function addClass() {},
+          removeClass: function removeClass() {},
+          getWidth: function getWidth() {},
+          registerInteractionHandler: function registerInteractionHandler() {},
+          deregisterInteractionHandler: function deregisterInteractionHandler() {}
+        }
+      );
+    }
+
+    /**
+     * @param {!MDCFloatingLabelAdapter} adapter
+     */
+
+  }]);
+
+  function MDCFloatingLabelFoundation(adapter) {
+    _classCallCheck(this, MDCFloatingLabelFoundation);
+
+    /** @private {function(!Event): undefined} */
+    var _this = _possibleConstructorReturn(this, (MDCFloatingLabelFoundation.__proto__ || Object.getPrototypeOf(MDCFloatingLabelFoundation)).call(this, _extends(MDCFloatingLabelFoundation.defaultAdapter, adapter)));
+
+    _this.shakeAnimationEndHandler_ = function () {
+      return _this.handleShakeAnimationEnd_();
+    };
+    return _this;
+  }
+
+  _createClass(MDCFloatingLabelFoundation, [{
+    key: 'init',
+    value: function init() {
+      this.adapter_.registerInteractionHandler('animationend', this.shakeAnimationEndHandler_);
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      this.adapter_.deregisterInteractionHandler('animationend', this.shakeAnimationEndHandler_);
+    }
+
+    /**
+     * Returns the width of the label element.
+     * @return {number}
+     */
+
+  }, {
+    key: 'getWidth',
+    value: function getWidth() {
+      return this.adapter_.getWidth();
+    }
+
+    /**
+     * Styles the label to produce the label shake for errors.
+     * @param {boolean} shouldShake adds shake class if true,
+     * otherwise removes shake class.
+     */
+
+  }, {
+    key: 'shake',
+    value: function shake(shouldShake) {
+      var LABEL_SHAKE = MDCFloatingLabelFoundation.cssClasses.LABEL_SHAKE;
+
+      if (shouldShake) {
+        this.adapter_.addClass(LABEL_SHAKE);
+      } else {
+        this.adapter_.removeClass(LABEL_SHAKE);
+      }
+    }
+
+    /**
+     * Styles the label to float or dock.
+     * @param {boolean} shouldFloat adds float class if true, otherwise remove
+     * float and shake class to dock label.
+     */
+
+  }, {
+    key: 'float',
+    value: function float(shouldFloat) {
+      var _MDCFloatingLabelFoun = MDCFloatingLabelFoundation.cssClasses,
+          LABEL_FLOAT_ABOVE = _MDCFloatingLabelFoun.LABEL_FLOAT_ABOVE,
+          LABEL_SHAKE = _MDCFloatingLabelFoun.LABEL_SHAKE;
+
+      if (shouldFloat) {
+        this.adapter_.addClass(LABEL_FLOAT_ABOVE);
+      } else {
+        this.adapter_.removeClass(LABEL_FLOAT_ABOVE);
+        this.adapter_.removeClass(LABEL_SHAKE);
+      }
+    }
+
+    /**
+     * Handles an interaction event on the root element.
+     */
+
+  }, {
+    key: 'handleShakeAnimationEnd_',
+    value: function handleShakeAnimationEnd_() {
+      var LABEL_SHAKE = MDCFloatingLabelFoundation.cssClasses.LABEL_SHAKE;
+
+      this.adapter_.removeClass(LABEL_SHAKE);
+    }
+  }]);
+
+  return MDCFloatingLabelFoundation;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_foundation__["a" /* default */]);
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCFloatingLabelFoundation);
+
+/***/ }),
+
+/***/ 21:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return cssClasses; });
+/**
+ * @license
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/** @enum {string} */
+var cssClasses = {
+  LABEL_FLOAT_ABOVE: 'mdc-floating-label--float-above',
+  LABEL_SHAKE: 'mdc-floating-label--shake'
+};
+
+
+
+/***/ }),
+
+/***/ 22:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MDCLineRipple", function() { return MDCLineRipple; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_component__ = __webpack_require__(1);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__adapter__ = __webpack_require__(14);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__foundation__ = __webpack_require__(23);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCLineRippleFoundation", function() { return __WEBPACK_IMPORTED_MODULE_2__foundation__["a"]; });
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * @license
+ * Copyright 2018 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+/**
+ * @extends {MDCComponent<!MDCLineRippleFoundation>}
+ * @final
+ */
+
+var MDCLineRipple = function (_MDCComponent) {
+  _inherits(MDCLineRipple, _MDCComponent);
+
+  function MDCLineRipple() {
+    _classCallCheck(this, MDCLineRipple);
+
+    return _possibleConstructorReturn(this, (MDCLineRipple.__proto__ || Object.getPrototypeOf(MDCLineRipple)).apply(this, arguments));
+  }
+
+  _createClass(MDCLineRipple, [{
+    key: 'activate',
+
+
+    /**
+     * Activates the line ripple
+     */
+    value: function activate() {
+      this.foundation_.activate();
+    }
+
+    /**
+     * Deactivates the line ripple
+     */
+
+  }, {
+    key: 'deactivate',
+    value: function deactivate() {
+      this.foundation_.deactivate();
+    }
+
+    /**
+     * Sets the transform origin given a user's click location. The `rippleCenter` is the
+     * x-coordinate of the middle of the ripple.
+     * @param {number} xCoordinate
+     */
+
+  }, {
+    key: 'setRippleCenter',
+    value: function setRippleCenter(xCoordinate) {
+      this.foundation_.setRippleCenter(xCoordinate);
+    }
+
+    /**
+     * @return {!MDCLineRippleFoundation}
+     */
+
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      var _this2 = this;
+
+      return new __WEBPACK_IMPORTED_MODULE_2__foundation__["a" /* default */]( /** @type {!MDCLineRippleAdapter} */_extends({
+        addClass: function addClass(className) {
+          return _this2.root_.classList.add(className);
+        },
+        removeClass: function removeClass(className) {
+          return _this2.root_.classList.remove(className);
+        },
+        hasClass: function hasClass(className) {
+          return _this2.root_.classList.contains(className);
+        },
+        setStyle: function setStyle(propertyName, value) {
+          return _this2.root_.style[propertyName] = value;
+        },
+        registerEventHandler: function registerEventHandler(evtType, handler) {
+          return _this2.root_.addEventListener(evtType, handler);
+        },
+        deregisterEventHandler: function deregisterEventHandler(evtType, handler) {
+          return _this2.root_.removeEventListener(evtType, handler);
+        }
+      }));
+    }
+  }], [{
+    key: 'attachTo',
+
+    /**
+     * @param {!Element} root
+     * @return {!MDCLineRipple}
+     */
+    value: function attachTo(root) {
+      return new MDCLineRipple(root);
+    }
+  }]);
+
+  return MDCLineRipple;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_component__["a" /* default */]);
+
+
+
+/***/ }),
+
+/***/ 23:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_foundation__ = __webpack_require__(0);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__adapter__ = __webpack_require__(14);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__constants__ = __webpack_require__(24);
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * @license
+ * Copyright 2018 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+/**
+ * @extends {MDCFoundation<!MDCLineRippleAdapter>}
+ * @final
+ */
+
+var MDCLineRippleFoundation = function (_MDCFoundation) {
+  _inherits(MDCLineRippleFoundation, _MDCFoundation);
+
+  _createClass(MDCLineRippleFoundation, null, [{
+    key: 'cssClasses',
+
+    /** @return enum {string} */
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */];
+    }
+
+    /**
+     * {@see MDCLineRippleAdapter} for typing information on parameters and return
+     * types.
+     * @return {!MDCLineRippleAdapter}
+     */
+
+  }, {
+    key: 'defaultAdapter',
+    get: function get() {
+      return (/** @type {!MDCLineRippleAdapter} */{
+          addClass: function addClass() {},
+          removeClass: function removeClass() {},
+          hasClass: function hasClass() {},
+          setStyle: function setStyle() {},
+          registerEventHandler: function registerEventHandler() {},
+          deregisterEventHandler: function deregisterEventHandler() {}
+        }
+      );
+    }
+
+    /**
+     * @param {!MDCLineRippleAdapter=} adapter
+     */
+
+  }]);
+
+  function MDCLineRippleFoundation() {
+    var adapter = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : /** @type {!MDCLineRippleAdapter} */{};
+
+    _classCallCheck(this, MDCLineRippleFoundation);
+
+    /** @private {function(!Event): undefined} */
+    var _this = _possibleConstructorReturn(this, (MDCLineRippleFoundation.__proto__ || Object.getPrototypeOf(MDCLineRippleFoundation)).call(this, _extends(MDCLineRippleFoundation.defaultAdapter, adapter)));
+
+    _this.transitionEndHandler_ = function (evt) {
+      return _this.handleTransitionEnd(evt);
+    };
+    return _this;
+  }
+
+  _createClass(MDCLineRippleFoundation, [{
+    key: 'init',
+    value: function init() {
+      this.adapter_.registerEventHandler('transitionend', this.transitionEndHandler_);
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      this.adapter_.deregisterEventHandler('transitionend', this.transitionEndHandler_);
+    }
+
+    /**
+     * Activates the line ripple
+     */
+
+  }, {
+    key: 'activate',
+    value: function activate() {
+      this.adapter_.removeClass(__WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */].LINE_RIPPLE_DEACTIVATING);
+      this.adapter_.addClass(__WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */].LINE_RIPPLE_ACTIVE);
+    }
+
+    /**
+     * Sets the center of the ripple animation to the given X coordinate.
+     * @param {number} xCoordinate
+     */
+
+  }, {
+    key: 'setRippleCenter',
+    value: function setRippleCenter(xCoordinate) {
+      this.adapter_.setStyle('transform-origin', xCoordinate + 'px center');
+    }
+
+    /**
+     * Deactivates the line ripple
+     */
+
+  }, {
+    key: 'deactivate',
+    value: function deactivate() {
+      this.adapter_.addClass(__WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */].LINE_RIPPLE_DEACTIVATING);
+    }
+
+    /**
+     * Handles a transition end event
+     * @param {!Event} evt
+     */
+
+  }, {
+    key: 'handleTransitionEnd',
+    value: function handleTransitionEnd(evt) {
+      // Wait for the line ripple to be either transparent or opaque
+      // before emitting the animation end event
+      var isDeactivating = this.adapter_.hasClass(__WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */].LINE_RIPPLE_DEACTIVATING);
+
+      if (evt.propertyName === 'opacity') {
+        if (isDeactivating) {
+          this.adapter_.removeClass(__WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */].LINE_RIPPLE_ACTIVE);
+          this.adapter_.removeClass(__WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */].LINE_RIPPLE_DEACTIVATING);
+        }
+      }
+    }
+  }]);
+
+  return MDCLineRippleFoundation;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_foundation__["a" /* default */]);
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCLineRippleFoundation);
+
+/***/ }),
+
+/***/ 24:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return cssClasses; });
+/**
+ * @license
+ * Copyright 2018 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/** @enum {string} */
+var cssClasses = {
+  LINE_RIPPLE_ACTIVE: 'mdc-line-ripple--active',
+  LINE_RIPPLE_DEACTIVATING: 'mdc-line-ripple--deactivating'
+};
+
+
+
+/***/ }),
+
+/***/ 25:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MDCNotchedOutline", function() { return MDCNotchedOutline; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_component__ = __webpack_require__(1);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__adapter__ = __webpack_require__(15);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__foundation__ = __webpack_require__(26);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__constants__ = __webpack_require__(16);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCNotchedOutlineFoundation", function() { return __WEBPACK_IMPORTED_MODULE_2__foundation__["a"]; });
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * @license
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+
+/**
+ * @extends {MDCComponent<!MDCNotchedOutlineFoundation>}
+ * @final
+ */
+
+var MDCNotchedOutline = function (_MDCComponent) {
+  _inherits(MDCNotchedOutline, _MDCComponent);
+
+  function MDCNotchedOutline() {
+    _classCallCheck(this, MDCNotchedOutline);
+
+    return _possibleConstructorReturn(this, (MDCNotchedOutline.__proto__ || Object.getPrototypeOf(MDCNotchedOutline)).apply(this, arguments));
+  }
+
+  _createClass(MDCNotchedOutline, [{
+    key: 'notch',
+
+
+    /**
+      * Updates outline selectors and SVG path to open notch.
+      * @param {number} notchWidth The notch width in the outline.
+      * @param {boolean=} isRtl Determines if outline is rtl. If rtl is true, notch
+      * will be right justified in outline path, otherwise left justified.
+      */
+    value: function notch(notchWidth, isRtl) {
+      this.foundation_.notch(notchWidth, isRtl);
+    }
+
+    /**
+     * Updates the outline selectors to close notch and return it to idle state.
+     */
+
+  }, {
+    key: 'closeNotch',
+    value: function closeNotch() {
+      this.foundation_.closeNotch();
+    }
+
+    /**
+     * @return {!MDCNotchedOutlineFoundation}
+     */
+
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      var _this2 = this;
+
+      return new __WEBPACK_IMPORTED_MODULE_2__foundation__["a" /* default */]({
+        getWidth: function getWidth() {
+          return _this2.root_.offsetWidth;
+        },
+        getHeight: function getHeight() {
+          return _this2.root_.offsetHeight;
+        },
+        addClass: function addClass(className) {
+          return _this2.root_.classList.add(className);
+        },
+        removeClass: function removeClass(className) {
+          return _this2.root_.classList.remove(className);
+        },
+        setOutlinePathAttr: function setOutlinePathAttr(value) {
+          var path = _this2.root_.querySelector(__WEBPACK_IMPORTED_MODULE_3__constants__["b" /* strings */].PATH_SELECTOR);
+          path.setAttribute('d', value);
+        },
+        getIdleOutlineStyleValue: function getIdleOutlineStyleValue(propertyName) {
+          var idleOutlineElement = _this2.root_.parentNode.querySelector(__WEBPACK_IMPORTED_MODULE_3__constants__["b" /* strings */].IDLE_OUTLINE_SELECTOR);
+          return window.getComputedStyle(idleOutlineElement).getPropertyValue(propertyName);
+        }
+      });
+    }
+  }], [{
+    key: 'attachTo',
+
+    /**
+     * @param {!Element} root
+     * @return {!MDCNotchedOutline}
+     */
+    value: function attachTo(root) {
+      return new MDCNotchedOutline(root);
+    }
+  }]);
+
+  return MDCNotchedOutline;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_component__["a" /* default */]);
+
+
+
+/***/ }),
+
+/***/ 26:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_foundation__ = __webpack_require__(0);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__adapter__ = __webpack_require__(15);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__constants__ = __webpack_require__(16);
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * @license
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+/**
+ * @extends {MDCFoundation<!MDCNotchedOutlineAdapter>}
+ * @final
+ */
+
+var MDCNotchedOutlineFoundation = function (_MDCFoundation) {
+  _inherits(MDCNotchedOutlineFoundation, _MDCFoundation);
+
+  _createClass(MDCNotchedOutlineFoundation, null, [{
+    key: 'strings',
+
+    /** @return enum {string} */
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["b" /* strings */];
+    }
+
+    /** @return enum {string} */
+
+  }, {
+    key: 'cssClasses',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */];
+    }
+
+    /**
+     * {@see MDCNotchedOutlineAdapter} for typing information on parameters and return
+     * types.
+     * @return {!MDCNotchedOutlineAdapter}
+     */
+
+  }, {
+    key: 'defaultAdapter',
+    get: function get() {
+      return (/** @type {!MDCNotchedOutlineAdapter} */{
+          getWidth: function getWidth() {},
+          getHeight: function getHeight() {},
+          addClass: function addClass() {},
+          removeClass: function removeClass() {},
+          setOutlinePathAttr: function setOutlinePathAttr() {},
+          getIdleOutlineStyleValue: function getIdleOutlineStyleValue() {}
+        }
+      );
+    }
+
+    /**
+     * @param {!MDCNotchedOutlineAdapter} adapter
+     */
+
+  }]);
+
+  function MDCNotchedOutlineFoundation(adapter) {
+    _classCallCheck(this, MDCNotchedOutlineFoundation);
+
+    return _possibleConstructorReturn(this, (MDCNotchedOutlineFoundation.__proto__ || Object.getPrototypeOf(MDCNotchedOutlineFoundation)).call(this, _extends(MDCNotchedOutlineFoundation.defaultAdapter, adapter)));
+  }
+
+  /**
+   * Adds the outline notched selector and updates the notch width
+   * calculated based off of notchWidth and isRtl.
+   * @param {number} notchWidth
+   * @param {boolean=} isRtl
+   */
+
+
+  _createClass(MDCNotchedOutlineFoundation, [{
+    key: 'notch',
+    value: function notch(notchWidth) {
+      var isRtl = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+      var OUTLINE_NOTCHED = MDCNotchedOutlineFoundation.cssClasses.OUTLINE_NOTCHED;
+
+      this.adapter_.addClass(OUTLINE_NOTCHED);
+      this.updateSvgPath_(notchWidth, isRtl);
+    }
+
+    /**
+     * Removes notched outline selector to close the notch in the outline.
+     */
+
+  }, {
+    key: 'closeNotch',
+    value: function closeNotch() {
+      var OUTLINE_NOTCHED = MDCNotchedOutlineFoundation.cssClasses.OUTLINE_NOTCHED;
+
+      this.adapter_.removeClass(OUTLINE_NOTCHED);
+    }
+
+    /**
+     * Updates the SVG path of the focus outline element based on the notchWidth
+     * and the RTL context.
+     * @param {number} notchWidth
+     * @param {boolean=} isRtl
+     * @private
+     */
+
+  }, {
+    key: 'updateSvgPath_',
+    value: function updateSvgPath_(notchWidth, isRtl) {
+      // Fall back to reading a specific corner's style because Firefox doesn't report the style on border-radius.
+      var radiusStyleValue = this.adapter_.getIdleOutlineStyleValue('border-radius') || this.adapter_.getIdleOutlineStyleValue('border-top-left-radius');
+      var radius = parseFloat(radiusStyleValue);
+      var width = this.adapter_.getWidth();
+      var height = this.adapter_.getHeight();
+      var cornerWidth = radius + 1.2;
+      var leadingStrokeLength = Math.abs(11 - cornerWidth);
+      var paddedNotchWidth = notchWidth + 8;
+
+      // The right, bottom, and left sides of the outline follow the same SVG path.
+      var pathMiddle = 'a' + radius + ',' + radius + ' 0 0 1 ' + radius + ',' + radius + 'v' + (height - 2 * cornerWidth) + 'a' + radius + ',' + radius + ' 0 0 1 ' + -radius + ',' + radius + 'h' + (-width + 2 * cornerWidth) + 'a' + radius + ',' + radius + ' 0 0 1 ' + -radius + ',' + -radius + 'v' + (-height + 2 * cornerWidth) + 'a' + radius + ',' + radius + ' 0 0 1 ' + radius + ',' + -radius;
+
+      var path = void 0;
+      if (!isRtl) {
+        path = 'M' + (cornerWidth + leadingStrokeLength + paddedNotchWidth) + ',' + 1 + 'h' + (width - 2 * cornerWidth - paddedNotchWidth - leadingStrokeLength) + pathMiddle + 'h' + leadingStrokeLength;
+      } else {
+        path = 'M' + (width - cornerWidth - leadingStrokeLength) + ',' + 1 + 'h' + leadingStrokeLength + pathMiddle + 'h' + (width - 2 * cornerWidth - paddedNotchWidth - leadingStrokeLength);
+      }
+
+      this.adapter_.setOutlinePathAttr(path);
+    }
+  }]);
+
+  return MDCNotchedOutlineFoundation;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_foundation__["a" /* default */]);
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCNotchedOutlineFoundation);
+
+/***/ }),
+
+/***/ 3:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * @license
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/* eslint no-unused-vars: [2, {"args": "none"}] */
+
+/**
+ * Adapter for MDC Ripple. Provides an interface for managing
+ * - classes
+ * - dom
+ * - CSS variables
+ * - position
+ * - dimensions
+ * - scroll position
+ * - event handlers
+ * - unbounded, active and disabled states
+ *
+ * Additionally, provides type information for the adapter to the Closure
+ * compiler.
+ *
+ * Implement this adapter for your framework of choice to delegate updates to
+ * the component in your framework of choice. See architecture documentation
+ * for more details.
+ * https://github.com/material-components/material-components-web/blob/master/docs/code/architecture.md
+ *
+ * @record
+ */
+var MDCRippleAdapter = function () {
+  function MDCRippleAdapter() {
+    _classCallCheck(this, MDCRippleAdapter);
+  }
+
+  _createClass(MDCRippleAdapter, [{
+    key: "browserSupportsCssVars",
+
+    /** @return {boolean} */
+    value: function browserSupportsCssVars() {}
+
+    /** @return {boolean} */
+
+  }, {
+    key: "isUnbounded",
+    value: function isUnbounded() {}
+
+    /** @return {boolean} */
+
+  }, {
+    key: "isSurfaceActive",
+    value: function isSurfaceActive() {}
+
+    /** @return {boolean} */
+
+  }, {
+    key: "isSurfaceDisabled",
+    value: function isSurfaceDisabled() {}
+
+    /** @param {string} className */
+
+  }, {
+    key: "addClass",
+    value: function addClass(className) {}
+
+    /** @param {string} className */
+
+  }, {
+    key: "removeClass",
+    value: function removeClass(className) {}
+
+    /** @param {!EventTarget} target */
+
+  }, {
+    key: "containsEventTarget",
+    value: function containsEventTarget(target) {}
+
+    /**
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: "registerInteractionHandler",
+    value: function registerInteractionHandler(evtType, handler) {}
+
+    /**
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: "deregisterInteractionHandler",
+    value: function deregisterInteractionHandler(evtType, handler) {}
+
+    /**
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: "registerDocumentInteractionHandler",
+    value: function registerDocumentInteractionHandler(evtType, handler) {}
+
+    /**
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: "deregisterDocumentInteractionHandler",
+    value: function deregisterDocumentInteractionHandler(evtType, handler) {}
+
+    /**
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: "registerResizeHandler",
+    value: function registerResizeHandler(handler) {}
+
+    /**
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: "deregisterResizeHandler",
+    value: function deregisterResizeHandler(handler) {}
+
+    /**
+     * @param {string} varName
+     * @param {?number|string} value
+     */
+
+  }, {
+    key: "updateCssVariable",
+    value: function updateCssVariable(varName, value) {}
+
+    /** @return {!ClientRect} */
+
+  }, {
+    key: "computeBoundingRect",
+    value: function computeBoundingRect() {}
+
+    /** @return {{x: number, y: number}} */
+
+  }, {
+    key: "getWindowPageOffset",
+    value: function getWindowPageOffset() {}
+  }]);
+
+  return MDCRippleAdapter;
+}();
+
+/* unused harmony default export */ var _unused_webpack_default_export = (MDCRippleAdapter);
+
+/***/ }),
+
+/***/ 4:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MDCRipple", function() { return MDCRipple; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "RippleCapableSurface", function() { return RippleCapableSurface; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_component__ = __webpack_require__(1);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__adapter__ = __webpack_require__(3);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__foundation__ = __webpack_require__(5);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__util__ = __webpack_require__(2);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCRippleFoundation", function() { return __WEBPACK_IMPORTED_MODULE_2__foundation__["a"]; });
+/* harmony reexport (module object) */ __webpack_require__.d(__webpack_exports__, "util", function() { return __WEBPACK_IMPORTED_MODULE_3__util__; });
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * @license
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+/**
+ * @extends MDCComponent<!MDCRippleFoundation>
+ */
+
+var MDCRipple = function (_MDCComponent) {
+  _inherits(MDCRipple, _MDCComponent);
+
+  /** @param {...?} args */
+  function MDCRipple() {
+    var _ref;
+
+    _classCallCheck(this, MDCRipple);
+
+    for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    /** @type {boolean} */
+    var _this = _possibleConstructorReturn(this, (_ref = MDCRipple.__proto__ || Object.getPrototypeOf(MDCRipple)).call.apply(_ref, [this].concat(args)));
+
+    _this.disabled = false;
+
+    /** @private {boolean} */
+    _this.unbounded_;
+    return _this;
+  }
+
+  /**
+   * @param {!Element} root
+   * @param {{isUnbounded: (boolean|undefined)}=} options
+   * @return {!MDCRipple}
+   */
+
+
+  _createClass(MDCRipple, [{
+    key: 'setUnbounded_',
+
+
+    /**
+     * Closure Compiler throws an access control error when directly accessing a
+     * protected or private property inside a getter/setter, like unbounded above.
+     * By accessing the protected property inside a method, we solve that problem.
+     * That's why this function exists.
+     * @private
+     */
+    value: function setUnbounded_() {
+      this.foundation_.setUnbounded(this.unbounded_);
+    }
+  }, {
+    key: 'activate',
+    value: function activate() {
+      this.foundation_.activate();
+    }
+  }, {
+    key: 'deactivate',
+    value: function deactivate() {
+      this.foundation_.deactivate();
+    }
+  }, {
+    key: 'layout',
+    value: function layout() {
+      this.foundation_.layout();
+    }
+
+    /**
+     * @return {!MDCRippleFoundation}
+     * @override
+     */
+
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      return new __WEBPACK_IMPORTED_MODULE_2__foundation__["a" /* default */](MDCRipple.createAdapter(this));
+    }
+
+    /** @override */
+
+  }, {
+    key: 'initialSyncWithDOM',
+    value: function initialSyncWithDOM() {
+      this.unbounded = 'mdcRippleIsUnbounded' in this.root_.dataset;
+    }
+  }, {
+    key: 'unbounded',
+
+
+    /** @return {boolean} */
+    get: function get() {
+      return this.unbounded_;
+    }
+
+    /** @param {boolean} unbounded */
+    ,
+    set: function set(unbounded) {
+      this.unbounded_ = Boolean(unbounded);
+      this.setUnbounded_();
+    }
+  }], [{
+    key: 'attachTo',
+    value: function attachTo(root) {
+      var _ref2 = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
+          _ref2$isUnbounded = _ref2.isUnbounded,
+          isUnbounded = _ref2$isUnbounded === undefined ? undefined : _ref2$isUnbounded;
+
+      var ripple = new MDCRipple(root);
+      // Only override unbounded behavior if option is explicitly specified
+      if (isUnbounded !== undefined) {
+        ripple.unbounded = /** @type {boolean} */isUnbounded;
+      }
+      return ripple;
+    }
+
+    /**
+     * @param {!RippleCapableSurface} instance
+     * @return {!MDCRippleAdapter}
+     */
+
+  }, {
+    key: 'createAdapter',
+    value: function createAdapter(instance) {
+      var MATCHES = __WEBPACK_IMPORTED_MODULE_3__util__["getMatchesProperty"](HTMLElement.prototype);
+
+      return {
+        browserSupportsCssVars: function browserSupportsCssVars() {
+          return __WEBPACK_IMPORTED_MODULE_3__util__["supportsCssVariables"](window);
+        },
+        isUnbounded: function isUnbounded() {
+          return instance.unbounded;
+        },
+        isSurfaceActive: function isSurfaceActive() {
+          return instance.root_[MATCHES](':active');
+        },
+        isSurfaceDisabled: function isSurfaceDisabled() {
+          return instance.disabled;
+        },
+        addClass: function addClass(className) {
+          return instance.root_.classList.add(className);
+        },
+        removeClass: function removeClass(className) {
+          return instance.root_.classList.remove(className);
+        },
+        containsEventTarget: function containsEventTarget(target) {
+          return instance.root_.contains(target);
+        },
+        registerInteractionHandler: function registerInteractionHandler(evtType, handler) {
+          return instance.root_.addEventListener(evtType, handler, __WEBPACK_IMPORTED_MODULE_3__util__["applyPassive"]());
+        },
+        deregisterInteractionHandler: function deregisterInteractionHandler(evtType, handler) {
+          return instance.root_.removeEventListener(evtType, handler, __WEBPACK_IMPORTED_MODULE_3__util__["applyPassive"]());
+        },
+        registerDocumentInteractionHandler: function registerDocumentInteractionHandler(evtType, handler) {
+          return document.documentElement.addEventListener(evtType, handler, __WEBPACK_IMPORTED_MODULE_3__util__["applyPassive"]());
+        },
+        deregisterDocumentInteractionHandler: function deregisterDocumentInteractionHandler(evtType, handler) {
+          return document.documentElement.removeEventListener(evtType, handler, __WEBPACK_IMPORTED_MODULE_3__util__["applyPassive"]());
+        },
+        registerResizeHandler: function registerResizeHandler(handler) {
+          return window.addEventListener('resize', handler);
+        },
+        deregisterResizeHandler: function deregisterResizeHandler(handler) {
+          return window.removeEventListener('resize', handler);
+        },
+        updateCssVariable: function updateCssVariable(varName, value) {
+          return instance.root_.style.setProperty(varName, value);
+        },
+        computeBoundingRect: function computeBoundingRect() {
+          return instance.root_.getBoundingClientRect();
+        },
+        getWindowPageOffset: function getWindowPageOffset() {
+          return { x: window.pageXOffset, y: window.pageYOffset };
+        }
+      };
+    }
+  }]);
+
+  return MDCRipple;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_component__["a" /* default */]);
+
+/**
+ * See Material Design spec for more details on when to use ripples.
+ * https://material.io/guidelines/motion/choreography.html#choreography-creation
+ * @record
+ */
+
+
+var RippleCapableSurface = function RippleCapableSurface() {
+  _classCallCheck(this, RippleCapableSurface);
+};
+
+/** @protected {!Element} */
+
+
+RippleCapableSurface.prototype.root_;
+
+/**
+ * Whether or not the ripple bleeds out of the bounds of the element.
+ * @type {boolean|undefined}
+ */
+RippleCapableSurface.prototype.unbounded;
+
+/**
+ * Whether or not the ripple is attached to a disabled component.
+ * @type {boolean|undefined}
+ */
+RippleCapableSurface.prototype.disabled;
+
+
+
+/***/ }),
+
+/***/ 47:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_foundation__ = __webpack_require__(0);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__adapter__ = __webpack_require__(66);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__constants__ = __webpack_require__(142);
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * @license
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+/**
+ * @extends {MDCFoundation<!MDCTextFieldHelperTextAdapter>}
+ * @final
+ */
+
+var MDCTextFieldHelperTextFoundation = function (_MDCFoundation) {
+  _inherits(MDCTextFieldHelperTextFoundation, _MDCFoundation);
+
+  _createClass(MDCTextFieldHelperTextFoundation, null, [{
+    key: 'cssClasses',
+
+    /** @return enum {string} */
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */];
+    }
+
+    /** @return enum {string} */
+
+  }, {
+    key: 'strings',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["b" /* strings */];
+    }
+
+    /**
+     * {@see MDCTextFieldHelperTextAdapter} for typing information on parameters and return
+     * types.
+     * @return {!MDCTextFieldHelperTextAdapter}
+     */
+
+  }, {
+    key: 'defaultAdapter',
+    get: function get() {
+      return (/** @type {!MDCTextFieldHelperTextAdapter} */{
+          addClass: function addClass() {},
+          removeClass: function removeClass() {},
+          hasClass: function hasClass() {},
+          setAttr: function setAttr() {},
+          removeAttr: function removeAttr() {},
+          setContent: function setContent() {}
+        }
+      );
+    }
+
+    /**
+     * @param {!MDCTextFieldHelperTextAdapter} adapter
+     */
+
+  }]);
+
+  function MDCTextFieldHelperTextFoundation(adapter) {
+    _classCallCheck(this, MDCTextFieldHelperTextFoundation);
+
+    return _possibleConstructorReturn(this, (MDCTextFieldHelperTextFoundation.__proto__ || Object.getPrototypeOf(MDCTextFieldHelperTextFoundation)).call(this, _extends(MDCTextFieldHelperTextFoundation.defaultAdapter, adapter)));
+  }
+
+  /**
+   * Sets the content of the helper text field.
+   * @param {string} content
+   */
+
+
+  _createClass(MDCTextFieldHelperTextFoundation, [{
+    key: 'setContent',
+    value: function setContent(content) {
+      this.adapter_.setContent(content);
+    }
+
+    /** @param {boolean} isPersistent Sets the persistency of the helper text. */
+
+  }, {
+    key: 'setPersistent',
+    value: function setPersistent(isPersistent) {
+      if (isPersistent) {
+        this.adapter_.addClass(__WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */].HELPER_TEXT_PERSISTENT);
+      } else {
+        this.adapter_.removeClass(__WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */].HELPER_TEXT_PERSISTENT);
+      }
+    }
+
+    /**
+     * @param {boolean} isValidation True to make the helper text act as an
+     *   error validation message.
+     */
+
+  }, {
+    key: 'setValidation',
+    value: function setValidation(isValidation) {
+      if (isValidation) {
+        this.adapter_.addClass(__WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */].HELPER_TEXT_VALIDATION_MSG);
+      } else {
+        this.adapter_.removeClass(__WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */].HELPER_TEXT_VALIDATION_MSG);
+      }
+    }
+
+    /** Makes the helper text visible to the screen reader. */
+
+  }, {
+    key: 'showToScreenReader',
+    value: function showToScreenReader() {
+      this.adapter_.removeAttr(__WEBPACK_IMPORTED_MODULE_2__constants__["b" /* strings */].ARIA_HIDDEN);
+    }
+
+    /**
+     * Sets the validity of the helper text based on the input validity.
+     * @param {boolean} inputIsValid
+     */
+
+  }, {
+    key: 'setValidity',
+    value: function setValidity(inputIsValid) {
+      var helperTextIsPersistent = this.adapter_.hasClass(__WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */].HELPER_TEXT_PERSISTENT);
+      var helperTextIsValidationMsg = this.adapter_.hasClass(__WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */].HELPER_TEXT_VALIDATION_MSG);
+      var validationMsgNeedsDisplay = helperTextIsValidationMsg && !inputIsValid;
+
+      if (validationMsgNeedsDisplay) {
+        this.adapter_.setAttr(__WEBPACK_IMPORTED_MODULE_2__constants__["b" /* strings */].ROLE, 'alert');
+      } else {
+        this.adapter_.removeAttr(__WEBPACK_IMPORTED_MODULE_2__constants__["b" /* strings */].ROLE);
+      }
+
+      if (!helperTextIsPersistent && !validationMsgNeedsDisplay) {
+        this.hide_();
+      }
+    }
+
+    /**
+     * Hides the help text from screen readers.
+     * @private
+     */
+
+  }, {
+    key: 'hide_',
+    value: function hide_() {
+      this.adapter_.setAttr(__WEBPACK_IMPORTED_MODULE_2__constants__["b" /* strings */].ARIA_HIDDEN, 'true');
+    }
+  }]);
+
+  return MDCTextFieldHelperTextFoundation;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_foundation__["a" /* default */]);
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCTextFieldHelperTextFoundation);
+
+/***/ }),
+
+/***/ 48:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_foundation__ = __webpack_require__(0);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__adapter__ = __webpack_require__(67);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__constants__ = __webpack_require__(143);
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * @license
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+/**
+ * @extends {MDCFoundation<!MDCTextFieldIconAdapter>}
+ * @final
+ */
+
+var MDCTextFieldIconFoundation = function (_MDCFoundation) {
+  _inherits(MDCTextFieldIconFoundation, _MDCFoundation);
+
+  _createClass(MDCTextFieldIconFoundation, null, [{
+    key: 'strings',
+
+    /** @return enum {string} */
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["a" /* strings */];
+    }
+
+    /**
+     * {@see MDCTextFieldIconAdapter} for typing information on parameters and return
+     * types.
+     * @return {!MDCTextFieldIconAdapter}
+     */
+
+  }, {
+    key: 'defaultAdapter',
+    get: function get() {
+      return (/** @type {!MDCTextFieldIconAdapter} */{
+          getAttr: function getAttr() {},
+          setAttr: function setAttr() {},
+          removeAttr: function removeAttr() {},
+          setContent: function setContent() {},
+          registerInteractionHandler: function registerInteractionHandler() {},
+          deregisterInteractionHandler: function deregisterInteractionHandler() {},
+          notifyIconAction: function notifyIconAction() {}
+        }
+      );
+    }
+
+    /**
+     * @param {!MDCTextFieldIconAdapter} adapter
+     */
+
+  }]);
+
+  function MDCTextFieldIconFoundation(adapter) {
+    _classCallCheck(this, MDCTextFieldIconFoundation);
+
+    /** @private {string?} */
+    var _this = _possibleConstructorReturn(this, (MDCTextFieldIconFoundation.__proto__ || Object.getPrototypeOf(MDCTextFieldIconFoundation)).call(this, _extends(MDCTextFieldIconFoundation.defaultAdapter, adapter)));
+
+    _this.savedTabIndex_ = null;
+
+    /** @private {function(!Event): undefined} */
+    _this.interactionHandler_ = function (evt) {
+      return _this.handleInteraction(evt);
+    };
+    return _this;
+  }
+
+  _createClass(MDCTextFieldIconFoundation, [{
+    key: 'init',
+    value: function init() {
+      var _this2 = this;
+
+      this.savedTabIndex_ = this.adapter_.getAttr('tabindex');
+
+      ['click', 'keydown'].forEach(function (evtType) {
+        _this2.adapter_.registerInteractionHandler(evtType, _this2.interactionHandler_);
+      });
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      var _this3 = this;
+
+      ['click', 'keydown'].forEach(function (evtType) {
+        _this3.adapter_.deregisterInteractionHandler(evtType, _this3.interactionHandler_);
+      });
+    }
+
+    /** @param {boolean} disabled */
+
+  }, {
+    key: 'setDisabled',
+    value: function setDisabled(disabled) {
+      if (!this.savedTabIndex_) {
+        return;
+      }
+
+      if (disabled) {
+        this.adapter_.setAttr('tabindex', '-1');
+        this.adapter_.removeAttr('role');
+      } else {
+        this.adapter_.setAttr('tabindex', this.savedTabIndex_);
+        this.adapter_.setAttr('role', __WEBPACK_IMPORTED_MODULE_2__constants__["a" /* strings */].ICON_ROLE);
+      }
+    }
+
+    /** @param {string} label */
+
+  }, {
+    key: 'setAriaLabel',
+    value: function setAriaLabel(label) {
+      this.adapter_.setAttr('aria-label', label);
+    }
+
+    /** @param {string} content */
+
+  }, {
+    key: 'setContent',
+    value: function setContent(content) {
+      this.adapter_.setContent(content);
+    }
+
+    /**
+     * Handles an interaction event
+     * @param {!Event} evt
+     */
+
+  }, {
+    key: 'handleInteraction',
+    value: function handleInteraction(evt) {
+      if (evt.type === 'click' || evt.key === 'Enter' || evt.keyCode === 13) {
+        this.adapter_.notifyIconAction();
+      }
+    }
+  }]);
+
+  return MDCTextFieldIconFoundation;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_foundation__["a" /* default */]);
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCTextFieldIconFoundation);
+
+/***/ }),
+
+/***/ 5:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_foundation__ = __webpack_require__(0);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__adapter__ = __webpack_require__(3);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__constants__ = __webpack_require__(6);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__util__ = __webpack_require__(2);
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * @license
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+/**
+ * @typedef {{
+ *   isActivated: (boolean|undefined),
+ *   hasDeactivationUXRun: (boolean|undefined),
+ *   wasActivatedByPointer: (boolean|undefined),
+ *   wasElementMadeActive: (boolean|undefined),
+ *   activationEvent: Event,
+ *   isProgrammatic: (boolean|undefined)
+ * }}
+ */
+var ActivationStateType = void 0;
+
+/**
+ * @typedef {{
+ *   activate: (string|undefined),
+ *   deactivate: (string|undefined),
+ *   focus: (string|undefined),
+ *   blur: (string|undefined)
+ * }}
+ */
+var ListenerInfoType = void 0;
+
+/**
+ * @typedef {{
+ *   activate: function(!Event),
+ *   deactivate: function(!Event),
+ *   focus: function(),
+ *   blur: function()
+ * }}
+ */
+var ListenersType = void 0;
+
+/**
+ * @typedef {{
+ *   x: number,
+ *   y: number
+ * }}
+ */
+var PointType = void 0;
+
+// Activation events registered on the root element of each instance for activation
+var ACTIVATION_EVENT_TYPES = ['touchstart', 'pointerdown', 'mousedown', 'keydown'];
+
+// Deactivation events registered on documentElement when a pointer-related down event occurs
+var POINTER_DEACTIVATION_EVENT_TYPES = ['touchend', 'pointerup', 'mouseup'];
+
+// Tracks activations that have occurred on the current frame, to avoid simultaneous nested activations
+/** @type {!Array<!EventTarget>} */
+var activatedTargets = [];
+
+/**
+ * @extends {MDCFoundation<!MDCRippleAdapter>}
+ */
+
+var MDCRippleFoundation = function (_MDCFoundation) {
+  _inherits(MDCRippleFoundation, _MDCFoundation);
+
+  _createClass(MDCRippleFoundation, null, [{
+    key: 'cssClasses',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */];
+    }
+  }, {
+    key: 'strings',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["c" /* strings */];
+    }
+  }, {
+    key: 'numbers',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["b" /* numbers */];
+    }
+  }, {
+    key: 'defaultAdapter',
+    get: function get() {
+      return {
+        browserSupportsCssVars: function browserSupportsCssVars() /* boolean - cached */{},
+        isUnbounded: function isUnbounded() /* boolean */{},
+        isSurfaceActive: function isSurfaceActive() /* boolean */{},
+        isSurfaceDisabled: function isSurfaceDisabled() /* boolean */{},
+        addClass: function addClass() /* className: string */{},
+        removeClass: function removeClass() /* className: string */{},
+        containsEventTarget: function containsEventTarget() /* target: !EventTarget */{},
+        registerInteractionHandler: function registerInteractionHandler() /* evtType: string, handler: EventListener */{},
+        deregisterInteractionHandler: function deregisterInteractionHandler() /* evtType: string, handler: EventListener */{},
+        registerDocumentInteractionHandler: function registerDocumentInteractionHandler() /* evtType: string, handler: EventListener */{},
+        deregisterDocumentInteractionHandler: function deregisterDocumentInteractionHandler() /* evtType: string, handler: EventListener */{},
+        registerResizeHandler: function registerResizeHandler() /* handler: EventListener */{},
+        deregisterResizeHandler: function deregisterResizeHandler() /* handler: EventListener */{},
+        updateCssVariable: function updateCssVariable() /* varName: string, value: string */{},
+        computeBoundingRect: function computeBoundingRect() /* ClientRect */{},
+        getWindowPageOffset: function getWindowPageOffset() /* {x: number, y: number} */{}
+      };
+    }
+  }]);
+
+  function MDCRippleFoundation(adapter) {
+    _classCallCheck(this, MDCRippleFoundation);
+
+    /** @private {number} */
+    var _this = _possibleConstructorReturn(this, (MDCRippleFoundation.__proto__ || Object.getPrototypeOf(MDCRippleFoundation)).call(this, _extends(MDCRippleFoundation.defaultAdapter, adapter)));
+
+    _this.layoutFrame_ = 0;
+
+    /** @private {!ClientRect} */
+    _this.frame_ = /** @type {!ClientRect} */{ width: 0, height: 0 };
+
+    /** @private {!ActivationStateType} */
+    _this.activationState_ = _this.defaultActivationState_();
+
+    /** @private {number} */
+    _this.initialSize_ = 0;
+
+    /** @private {number} */
+    _this.maxRadius_ = 0;
+
+    /** @private {function(!Event)} */
+    _this.activateHandler_ = function (e) {
+      return _this.activate_(e);
+    };
+
+    /** @private {function(!Event)} */
+    _this.deactivateHandler_ = function (e) {
+      return _this.deactivate_(e);
+    };
+
+    /** @private {function(?Event=)} */
+    _this.focusHandler_ = function () {
+      return _this.handleFocus();
+    };
+
+    /** @private {function(?Event=)} */
+    _this.blurHandler_ = function () {
+      return _this.handleBlur();
+    };
+
+    /** @private {!Function} */
+    _this.resizeHandler_ = function () {
+      return _this.layout();
+    };
+
+    /** @private {{left: number, top:number}} */
+    _this.unboundedCoords_ = {
+      left: 0,
+      top: 0
+    };
+
+    /** @private {number} */
+    _this.fgScale_ = 0;
+
+    /** @private {number} */
+    _this.activationTimer_ = 0;
+
+    /** @private {number} */
+    _this.fgDeactivationRemovalTimer_ = 0;
+
+    /** @private {boolean} */
+    _this.activationAnimationHasEnded_ = false;
+
+    /** @private {!Function} */
+    _this.activationTimerCallback_ = function () {
+      _this.activationAnimationHasEnded_ = true;
+      _this.runDeactivationUXLogicIfReady_();
+    };
+
+    /** @private {?Event} */
+    _this.previousActivationEvent_ = null;
+    return _this;
+  }
+
+  /**
+   * We compute this property so that we are not querying information about the client
+   * until the point in time where the foundation requests it. This prevents scenarios where
+   * client-side feature-detection may happen too early, such as when components are rendered on the server
+   * and then initialized at mount time on the client.
+   * @return {boolean}
+   * @private
+   */
+
+
+  _createClass(MDCRippleFoundation, [{
+    key: 'supportsPressRipple_',
+    value: function supportsPressRipple_() {
+      return this.adapter_.browserSupportsCssVars();
+    }
+
+    /**
+     * @return {!ActivationStateType}
+     */
+
+  }, {
+    key: 'defaultActivationState_',
+    value: function defaultActivationState_() {
+      return {
+        isActivated: false,
+        hasDeactivationUXRun: false,
+        wasActivatedByPointer: false,
+        wasElementMadeActive: false,
+        activationEvent: null,
+        isProgrammatic: false
+      };
+    }
+
+    /** @override */
+
+  }, {
+    key: 'init',
+    value: function init() {
+      var _this2 = this;
+
+      var supportsPressRipple = this.supportsPressRipple_();
+
+      this.registerRootHandlers_(supportsPressRipple);
+
+      if (supportsPressRipple) {
+        var _MDCRippleFoundation$ = MDCRippleFoundation.cssClasses,
+            ROOT = _MDCRippleFoundation$.ROOT,
+            UNBOUNDED = _MDCRippleFoundation$.UNBOUNDED;
+
+        requestAnimationFrame(function () {
+          _this2.adapter_.addClass(ROOT);
+          if (_this2.adapter_.isUnbounded()) {
+            _this2.adapter_.addClass(UNBOUNDED);
+            // Unbounded ripples need layout logic applied immediately to set coordinates for both shade and ripple
+            _this2.layoutInternal_();
+          }
+        });
+      }
+    }
+
+    /** @override */
+
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      var _this3 = this;
+
+      if (this.supportsPressRipple_()) {
+        if (this.activationTimer_) {
+          clearTimeout(this.activationTimer_);
+          this.activationTimer_ = 0;
+          var FG_ACTIVATION = MDCRippleFoundation.cssClasses.FG_ACTIVATION;
+
+          this.adapter_.removeClass(FG_ACTIVATION);
+        }
+
+        var _MDCRippleFoundation$2 = MDCRippleFoundation.cssClasses,
+            ROOT = _MDCRippleFoundation$2.ROOT,
+            UNBOUNDED = _MDCRippleFoundation$2.UNBOUNDED;
+
+        requestAnimationFrame(function () {
+          _this3.adapter_.removeClass(ROOT);
+          _this3.adapter_.removeClass(UNBOUNDED);
+          _this3.removeCssVars_();
+        });
+      }
+
+      this.deregisterRootHandlers_();
+      this.deregisterDeactivationHandlers_();
+    }
+
+    /**
+     * @param {boolean} supportsPressRipple Passed from init to save a redundant function call
+     * @private
+     */
+
+  }, {
+    key: 'registerRootHandlers_',
+    value: function registerRootHandlers_(supportsPressRipple) {
+      var _this4 = this;
+
+      if (supportsPressRipple) {
+        ACTIVATION_EVENT_TYPES.forEach(function (type) {
+          _this4.adapter_.registerInteractionHandler(type, _this4.activateHandler_);
+        });
+        if (this.adapter_.isUnbounded()) {
+          this.adapter_.registerResizeHandler(this.resizeHandler_);
+        }
+      }
+
+      this.adapter_.registerInteractionHandler('focus', this.focusHandler_);
+      this.adapter_.registerInteractionHandler('blur', this.blurHandler_);
+    }
+
+    /**
+     * @param {!Event} e
+     * @private
+     */
+
+  }, {
+    key: 'registerDeactivationHandlers_',
+    value: function registerDeactivationHandlers_(e) {
+      var _this5 = this;
+
+      if (e.type === 'keydown') {
+        this.adapter_.registerInteractionHandler('keyup', this.deactivateHandler_);
+      } else {
+        POINTER_DEACTIVATION_EVENT_TYPES.forEach(function (type) {
+          _this5.adapter_.registerDocumentInteractionHandler(type, _this5.deactivateHandler_);
+        });
+      }
+    }
+
+    /** @private */
+
+  }, {
+    key: 'deregisterRootHandlers_',
+    value: function deregisterRootHandlers_() {
+      var _this6 = this;
+
+      ACTIVATION_EVENT_TYPES.forEach(function (type) {
+        _this6.adapter_.deregisterInteractionHandler(type, _this6.activateHandler_);
+      });
+      this.adapter_.deregisterInteractionHandler('focus', this.focusHandler_);
+      this.adapter_.deregisterInteractionHandler('blur', this.blurHandler_);
+
+      if (this.adapter_.isUnbounded()) {
+        this.adapter_.deregisterResizeHandler(this.resizeHandler_);
+      }
+    }
+
+    /** @private */
+
+  }, {
+    key: 'deregisterDeactivationHandlers_',
+    value: function deregisterDeactivationHandlers_() {
+      var _this7 = this;
+
+      this.adapter_.deregisterInteractionHandler('keyup', this.deactivateHandler_);
+      POINTER_DEACTIVATION_EVENT_TYPES.forEach(function (type) {
+        _this7.adapter_.deregisterDocumentInteractionHandler(type, _this7.deactivateHandler_);
+      });
+    }
+
+    /** @private */
+
+  }, {
+    key: 'removeCssVars_',
+    value: function removeCssVars_() {
+      var _this8 = this;
+
+      var strings = MDCRippleFoundation.strings;
+
+      Object.keys(strings).forEach(function (k) {
+        if (k.indexOf('VAR_') === 0) {
+          _this8.adapter_.updateCssVariable(strings[k], null);
+        }
+      });
+    }
+
+    /**
+     * @param {?Event} e
+     * @private
+     */
+
+  }, {
+    key: 'activate_',
+    value: function activate_(e) {
+      var _this9 = this;
+
+      if (this.adapter_.isSurfaceDisabled()) {
+        return;
+      }
+
+      var activationState = this.activationState_;
+      if (activationState.isActivated) {
+        return;
+      }
+
+      // Avoid reacting to follow-on events fired by touch device after an already-processed user interaction
+      var previousActivationEvent = this.previousActivationEvent_;
+      var isSameInteraction = previousActivationEvent && e && previousActivationEvent.type !== e.type;
+      if (isSameInteraction) {
+        return;
+      }
+
+      activationState.isActivated = true;
+      activationState.isProgrammatic = e === null;
+      activationState.activationEvent = e;
+      activationState.wasActivatedByPointer = activationState.isProgrammatic ? false : e.type === 'mousedown' || e.type === 'touchstart' || e.type === 'pointerdown';
+
+      var hasActivatedChild = e && activatedTargets.length > 0 && activatedTargets.some(function (target) {
+        return _this9.adapter_.containsEventTarget(target);
+      });
+      if (hasActivatedChild) {
+        // Immediately reset activation state, while preserving logic that prevents touch follow-on events
+        this.resetActivationState_();
+        return;
+      }
+
+      if (e) {
+        activatedTargets.push( /** @type {!EventTarget} */e.target);
+        this.registerDeactivationHandlers_(e);
+      }
+
+      activationState.wasElementMadeActive = this.checkElementMadeActive_(e);
+      if (activationState.wasElementMadeActive) {
+        this.animateActivation_();
+      }
+
+      requestAnimationFrame(function () {
+        // Reset array on next frame after the current event has had a chance to bubble to prevent ancestor ripples
+        activatedTargets = [];
+
+        if (!activationState.wasElementMadeActive && (e.key === ' ' || e.keyCode === 32)) {
+          // If space was pressed, try again within an rAF call to detect :active, because different UAs report
+          // active states inconsistently when they're called within event handling code:
+          // - https://bugs.chromium.org/p/chromium/issues/detail?id=635971
+          // - https://bugzilla.mozilla.org/show_bug.cgi?id=1293741
+          // We try first outside rAF to support Edge, which does not exhibit this problem, but will crash if a CSS
+          // variable is set within a rAF callback for a submit button interaction (#2241).
+          activationState.wasElementMadeActive = _this9.checkElementMadeActive_(e);
+          if (activationState.wasElementMadeActive) {
+            _this9.animateActivation_();
+          }
+        }
+
+        if (!activationState.wasElementMadeActive) {
+          // Reset activation state immediately if element was not made active.
+          _this9.activationState_ = _this9.defaultActivationState_();
+        }
+      });
+    }
+
+    /**
+     * @param {?Event} e
+     * @private
+     */
+
+  }, {
+    key: 'checkElementMadeActive_',
+    value: function checkElementMadeActive_(e) {
+      return e && e.type === 'keydown' ? this.adapter_.isSurfaceActive() : true;
+    }
+
+    /**
+     * @param {?Event=} event Optional event containing position information.
+     */
+
+  }, {
+    key: 'activate',
+    value: function activate() {
+      var event = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
+
+      this.activate_(event);
+    }
+
+    /** @private */
+
+  }, {
+    key: 'animateActivation_',
+    value: function animateActivation_() {
+      var _this10 = this;
+
+      var _MDCRippleFoundation$3 = MDCRippleFoundation.strings,
+          VAR_FG_TRANSLATE_START = _MDCRippleFoundation$3.VAR_FG_TRANSLATE_START,
+          VAR_FG_TRANSLATE_END = _MDCRippleFoundation$3.VAR_FG_TRANSLATE_END;
+      var _MDCRippleFoundation$4 = MDCRippleFoundation.cssClasses,
+          FG_DEACTIVATION = _MDCRippleFoundation$4.FG_DEACTIVATION,
+          FG_ACTIVATION = _MDCRippleFoundation$4.FG_ACTIVATION;
+      var DEACTIVATION_TIMEOUT_MS = MDCRippleFoundation.numbers.DEACTIVATION_TIMEOUT_MS;
+
+
+      this.layoutInternal_();
+
+      var translateStart = '';
+      var translateEnd = '';
+
+      if (!this.adapter_.isUnbounded()) {
+        var _getFgTranslationCoor = this.getFgTranslationCoordinates_(),
+            startPoint = _getFgTranslationCoor.startPoint,
+            endPoint = _getFgTranslationCoor.endPoint;
+
+        translateStart = startPoint.x + 'px, ' + startPoint.y + 'px';
+        translateEnd = endPoint.x + 'px, ' + endPoint.y + 'px';
+      }
+
+      this.adapter_.updateCssVariable(VAR_FG_TRANSLATE_START, translateStart);
+      this.adapter_.updateCssVariable(VAR_FG_TRANSLATE_END, translateEnd);
+      // Cancel any ongoing activation/deactivation animations
+      clearTimeout(this.activationTimer_);
+      clearTimeout(this.fgDeactivationRemovalTimer_);
+      this.rmBoundedActivationClasses_();
+      this.adapter_.removeClass(FG_DEACTIVATION);
+
+      // Force layout in order to re-trigger the animation.
+      this.adapter_.computeBoundingRect();
+      this.adapter_.addClass(FG_ACTIVATION);
+      this.activationTimer_ = setTimeout(function () {
+        return _this10.activationTimerCallback_();
+      }, DEACTIVATION_TIMEOUT_MS);
+    }
+
+    /**
+     * @private
+     * @return {{startPoint: PointType, endPoint: PointType}}
+     */
+
+  }, {
+    key: 'getFgTranslationCoordinates_',
+    value: function getFgTranslationCoordinates_() {
+      var _activationState_ = this.activationState_,
+          activationEvent = _activationState_.activationEvent,
+          wasActivatedByPointer = _activationState_.wasActivatedByPointer;
+
+
+      var startPoint = void 0;
+      if (wasActivatedByPointer) {
+        startPoint = Object(__WEBPACK_IMPORTED_MODULE_3__util__["getNormalizedEventCoords"])(
+        /** @type {!Event} */activationEvent, this.adapter_.getWindowPageOffset(), this.adapter_.computeBoundingRect());
+      } else {
+        startPoint = {
+          x: this.frame_.width / 2,
+          y: this.frame_.height / 2
+        };
+      }
+      // Center the element around the start point.
+      startPoint = {
+        x: startPoint.x - this.initialSize_ / 2,
+        y: startPoint.y - this.initialSize_ / 2
+      };
+
+      var endPoint = {
+        x: this.frame_.width / 2 - this.initialSize_ / 2,
+        y: this.frame_.height / 2 - this.initialSize_ / 2
+      };
+
+      return { startPoint: startPoint, endPoint: endPoint };
+    }
+
+    /** @private */
+
+  }, {
+    key: 'runDeactivationUXLogicIfReady_',
+    value: function runDeactivationUXLogicIfReady_() {
+      var _this11 = this;
+
+      // This method is called both when a pointing device is released, and when the activation animation ends.
+      // The deactivation animation should only run after both of those occur.
+      var FG_DEACTIVATION = MDCRippleFoundation.cssClasses.FG_DEACTIVATION;
+      var _activationState_2 = this.activationState_,
+          hasDeactivationUXRun = _activationState_2.hasDeactivationUXRun,
+          isActivated = _activationState_2.isActivated;
+
+      var activationHasEnded = hasDeactivationUXRun || !isActivated;
+
+      if (activationHasEnded && this.activationAnimationHasEnded_) {
+        this.rmBoundedActivationClasses_();
+        this.adapter_.addClass(FG_DEACTIVATION);
+        this.fgDeactivationRemovalTimer_ = setTimeout(function () {
+          _this11.adapter_.removeClass(FG_DEACTIVATION);
+        }, __WEBPACK_IMPORTED_MODULE_2__constants__["b" /* numbers */].FG_DEACTIVATION_MS);
+      }
+    }
+
+    /** @private */
+
+  }, {
+    key: 'rmBoundedActivationClasses_',
+    value: function rmBoundedActivationClasses_() {
+      var FG_ACTIVATION = MDCRippleFoundation.cssClasses.FG_ACTIVATION;
+
+      this.adapter_.removeClass(FG_ACTIVATION);
+      this.activationAnimationHasEnded_ = false;
+      this.adapter_.computeBoundingRect();
+    }
+  }, {
+    key: 'resetActivationState_',
+    value: function resetActivationState_() {
+      var _this12 = this;
+
+      this.previousActivationEvent_ = this.activationState_.activationEvent;
+      this.activationState_ = this.defaultActivationState_();
+      // Touch devices may fire additional events for the same interaction within a short time.
+      // Store the previous event until it's safe to assume that subsequent events are for new interactions.
+      setTimeout(function () {
+        return _this12.previousActivationEvent_ = null;
+      }, MDCRippleFoundation.numbers.TAP_DELAY_MS);
+    }
+
+    /**
+     * @param {?Event} e
+     * @private
+     */
+
+  }, {
+    key: 'deactivate_',
+    value: function deactivate_(e) {
+      var _this13 = this;
+
+      var activationState = this.activationState_;
+      // This can happen in scenarios such as when you have a keyup event that blurs the element.
+      if (!activationState.isActivated) {
+        return;
+      }
+
+      var state = /** @type {!ActivationStateType} */_extends({}, activationState);
+
+      if (activationState.isProgrammatic) {
+        var evtObject = null;
+        requestAnimationFrame(function () {
+          return _this13.animateDeactivation_(evtObject, state);
+        });
+        this.resetActivationState_();
+      } else {
+        this.deregisterDeactivationHandlers_();
+        requestAnimationFrame(function () {
+          _this13.activationState_.hasDeactivationUXRun = true;
+          _this13.animateDeactivation_(e, state);
+          _this13.resetActivationState_();
+        });
+      }
+    }
+
+    /**
+     * @param {?Event=} event Optional event containing position information.
+     */
+
+  }, {
+    key: 'deactivate',
+    value: function deactivate() {
+      var event = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
+
+      this.deactivate_(event);
+    }
+
+    /**
+     * @param {Event} e
+     * @param {!ActivationStateType} options
+     * @private
+     */
+
+  }, {
+    key: 'animateDeactivation_',
+    value: function animateDeactivation_(e, _ref) {
+      var wasActivatedByPointer = _ref.wasActivatedByPointer,
+          wasElementMadeActive = _ref.wasElementMadeActive;
+
+      if (wasActivatedByPointer || wasElementMadeActive) {
+        this.runDeactivationUXLogicIfReady_();
+      }
+    }
+  }, {
+    key: 'layout',
+    value: function layout() {
+      var _this14 = this;
+
+      if (this.layoutFrame_) {
+        cancelAnimationFrame(this.layoutFrame_);
+      }
+      this.layoutFrame_ = requestAnimationFrame(function () {
+        _this14.layoutInternal_();
+        _this14.layoutFrame_ = 0;
+      });
+    }
+
+    /** @private */
+
+  }, {
+    key: 'layoutInternal_',
+    value: function layoutInternal_() {
+      var _this15 = this;
+
+      this.frame_ = this.adapter_.computeBoundingRect();
+      var maxDim = Math.max(this.frame_.height, this.frame_.width);
+
+      // Surface diameter is treated differently for unbounded vs. bounded ripples.
+      // Unbounded ripple diameter is calculated smaller since the surface is expected to already be padded appropriately
+      // to extend the hitbox, and the ripple is expected to meet the edges of the padded hitbox (which is typically
+      // square). Bounded ripples, on the other hand, are fully expected to expand beyond the surface's longest diameter
+      // (calculated based on the diagonal plus a constant padding), and are clipped at the surface's border via
+      // `overflow: hidden`.
+      var getBoundedRadius = function getBoundedRadius() {
+        var hypotenuse = Math.sqrt(Math.pow(_this15.frame_.width, 2) + Math.pow(_this15.frame_.height, 2));
+        return hypotenuse + MDCRippleFoundation.numbers.PADDING;
+      };
+
+      this.maxRadius_ = this.adapter_.isUnbounded() ? maxDim : getBoundedRadius();
+
+      // Ripple is sized as a fraction of the largest dimension of the surface, then scales up using a CSS scale transform
+      this.initialSize_ = maxDim * MDCRippleFoundation.numbers.INITIAL_ORIGIN_SCALE;
+      this.fgScale_ = this.maxRadius_ / this.initialSize_;
+
+      this.updateLayoutCssVars_();
+    }
+
+    /** @private */
+
+  }, {
+    key: 'updateLayoutCssVars_',
+    value: function updateLayoutCssVars_() {
+      var _MDCRippleFoundation$5 = MDCRippleFoundation.strings,
+          VAR_FG_SIZE = _MDCRippleFoundation$5.VAR_FG_SIZE,
+          VAR_LEFT = _MDCRippleFoundation$5.VAR_LEFT,
+          VAR_TOP = _MDCRippleFoundation$5.VAR_TOP,
+          VAR_FG_SCALE = _MDCRippleFoundation$5.VAR_FG_SCALE;
+
+
+      this.adapter_.updateCssVariable(VAR_FG_SIZE, this.initialSize_ + 'px');
+      this.adapter_.updateCssVariable(VAR_FG_SCALE, this.fgScale_);
+
+      if (this.adapter_.isUnbounded()) {
+        this.unboundedCoords_ = {
+          left: Math.round(this.frame_.width / 2 - this.initialSize_ / 2),
+          top: Math.round(this.frame_.height / 2 - this.initialSize_ / 2)
+        };
+
+        this.adapter_.updateCssVariable(VAR_LEFT, this.unboundedCoords_.left + 'px');
+        this.adapter_.updateCssVariable(VAR_TOP, this.unboundedCoords_.top + 'px');
+      }
+    }
+
+    /** @param {boolean} unbounded */
+
+  }, {
+    key: 'setUnbounded',
+    value: function setUnbounded(unbounded) {
+      var UNBOUNDED = MDCRippleFoundation.cssClasses.UNBOUNDED;
+
+      if (unbounded) {
+        this.adapter_.addClass(UNBOUNDED);
+      } else {
+        this.adapter_.removeClass(UNBOUNDED);
+      }
+    }
+  }, {
+    key: 'handleFocus',
+    value: function handleFocus() {
+      var _this16 = this;
+
+      requestAnimationFrame(function () {
+        return _this16.adapter_.addClass(MDCRippleFoundation.cssClasses.BG_FOCUSED);
+      });
+    }
+  }, {
+    key: 'handleBlur',
+    value: function handleBlur() {
+      var _this17 = this;
+
+      requestAnimationFrame(function () {
+        return _this17.adapter_.removeClass(MDCRippleFoundation.cssClasses.BG_FOCUSED);
+      });
+    }
+  }]);
+
+  return MDCRippleFoundation;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_foundation__["a" /* default */]);
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCRippleFoundation);
+
+/***/ }),
+
+/***/ 6:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return cssClasses; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "c", function() { return strings; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return numbers; });
+/**
+ * @license
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+var cssClasses = {
+  // Ripple is a special case where the "root" component is really a "mixin" of sorts,
+  // given that it's an 'upgrade' to an existing component. That being said it is the root
+  // CSS class that all other CSS classes derive from.
+  ROOT: 'mdc-ripple-upgraded',
+  UNBOUNDED: 'mdc-ripple-upgraded--unbounded',
+  BG_FOCUSED: 'mdc-ripple-upgraded--background-focused',
+  FG_ACTIVATION: 'mdc-ripple-upgraded--foreground-activation',
+  FG_DEACTIVATION: 'mdc-ripple-upgraded--foreground-deactivation'
+};
+
+var strings = {
+  VAR_LEFT: '--mdc-ripple-left',
+  VAR_TOP: '--mdc-ripple-top',
+  VAR_FG_SIZE: '--mdc-ripple-fg-size',
+  VAR_FG_SCALE: '--mdc-ripple-fg-scale',
+  VAR_FG_TRANSLATE_START: '--mdc-ripple-fg-translate-start',
+  VAR_FG_TRANSLATE_END: '--mdc-ripple-fg-translate-end'
+};
+
+var numbers = {
+  PADDING: 10,
+  INITIAL_ORIGIN_SCALE: 0.6,
+  DEACTIVATION_TIMEOUT_MS: 225, // Corresponds to $mdc-ripple-translate-duration (i.e. activation animation duration)
+  FG_DEACTIVATION_MS: 150, // Corresponds to $mdc-ripple-fade-out-duration (i.e. deactivation animation duration)
+  TAP_DELAY_MS: 300 };
+
+
+
+/***/ }),
+
+/***/ 64:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return cssClasses; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "d", function() { return strings; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "c", function() { return numbers; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return VALIDATION_ATTR_WHITELIST; });
+/**
+ * @license
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/** @enum {string} */
+var strings = {
+  ARIA_CONTROLS: 'aria-controls',
+  INPUT_SELECTOR: '.mdc-text-field__input',
+  LABEL_SELECTOR: '.mdc-floating-label',
+  ICON_SELECTOR: '.mdc-text-field__icon',
+  OUTLINE_SELECTOR: '.mdc-notched-outline',
+  LINE_RIPPLE_SELECTOR: '.mdc-line-ripple'
+};
+
+/** @enum {string} */
+var cssClasses = {
+  ROOT: 'mdc-text-field',
+  UPGRADED: 'mdc-text-field--upgraded',
+  DISABLED: 'mdc-text-field--disabled',
+  DENSE: 'mdc-text-field--dense',
+  FOCUSED: 'mdc-text-field--focused',
+  INVALID: 'mdc-text-field--invalid',
+  BOX: 'mdc-text-field--box',
+  OUTLINED: 'mdc-text-field--outlined'
+};
+
+/** @enum {number} */
+var numbers = {
+  LABEL_SCALE: 0.75,
+  DENSE_LABEL_SCALE: 0.923
+};
+
+// whitelist based off of https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/HTML5/Constraint_validation
+// under section: `Validation-related attributes`
+var VALIDATION_ATTR_WHITELIST = ['pattern', 'min', 'max', 'required', 'step', 'minlength', 'maxlength'];
+
+
+
+/***/ }),
+
+/***/ 65:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* unused harmony export MDCTextFieldAdapter */
+/* unused harmony export NativeInputType */
+/* unused harmony export FoundationMapType */
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__helper_text_foundation__ = __webpack_require__(47);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__icon_foundation__ = __webpack_require__(48);
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * @license
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/* eslint-disable no-unused-vars */
+
+
+
+/* eslint no-unused-vars: [2, {"args": "none"}] */
+
+/**
+ * @typedef {{
+ *   value: string,
+ *   disabled: boolean,
+ *   badInput: boolean,
+ *   validity: {
+ *     badInput: boolean,
+ *     valid: boolean,
+ *   },
+ * }}
+ */
+var NativeInputType = void 0;
+
+/**
+ * @typedef {{
+ *   helperText: (!MDCTextFieldHelperTextFoundation|undefined),
+ *   icon: (!MDCTextFieldIconFoundation|undefined),
+ * }}
+ */
+var FoundationMapType = void 0;
+
+/**
+ * Adapter for MDC Text Field.
+ *
+ * Defines the shape of the adapter expected by the foundation. Implement this
+ * adapter to integrate the Text Field into your framework. See
+ * https://github.com/material-components/material-components-web/blob/master/docs/authoring-components.md
+ * for more information.
+ *
+ * @record
+ */
+
+var MDCTextFieldAdapter = function () {
+  function MDCTextFieldAdapter() {
+    _classCallCheck(this, MDCTextFieldAdapter);
+  }
+
+  _createClass(MDCTextFieldAdapter, [{
+    key: 'addClass',
+
+    /**
+     * Adds a class to the root Element.
+     * @param {string} className
+     */
+    value: function addClass(className) {}
+
+    /**
+     * Removes a class from the root Element.
+     * @param {string} className
+     */
+
+  }, {
+    key: 'removeClass',
+    value: function removeClass(className) {}
+
+    /**
+     * Returns true if the root element contains the given class name.
+     * @param {string} className
+     * @return {boolean}
+     */
+
+  }, {
+    key: 'hasClass',
+    value: function hasClass(className) {}
+
+    /**
+     * Registers an event handler on the root element for a given event.
+     * @param {string} type
+     * @param {function(!Event): undefined} handler
+     */
+
+  }, {
+    key: 'registerTextFieldInteractionHandler',
+    value: function registerTextFieldInteractionHandler(type, handler) {}
+
+    /**
+     * Deregisters an event handler on the root element for a given event.
+     * @param {string} type
+     * @param {function(!Event): undefined} handler
+     */
+
+  }, {
+    key: 'deregisterTextFieldInteractionHandler',
+    value: function deregisterTextFieldInteractionHandler(type, handler) {}
+
+    /**
+     * Registers an event listener on the native input element for a given event.
+     * @param {string} evtType
+     * @param {function(!Event): undefined} handler
+     */
+
+  }, {
+    key: 'registerInputInteractionHandler',
+    value: function registerInputInteractionHandler(evtType, handler) {}
+
+    /**
+     * Deregisters an event listener on the native input element for a given event.
+     * @param {string} evtType
+     * @param {function(!Event): undefined} handler
+     */
+
+  }, {
+    key: 'deregisterInputInteractionHandler',
+    value: function deregisterInputInteractionHandler(evtType, handler) {}
+
+    /**
+     * Registers a validation attribute change listener on the input element.
+     * Handler accepts list of attribute names.
+     * @param {function(!Array<string>): undefined} handler
+     * @return {!MutationObserver}
+     */
+
+  }, {
+    key: 'registerValidationAttributeChangeHandler',
+    value: function registerValidationAttributeChangeHandler(handler) {}
+
+    /**
+     * Disconnects a validation attribute observer on the input element.
+     * @param {!MutationObserver} observer
+     */
+
+  }, {
+    key: 'deregisterValidationAttributeChangeHandler',
+    value: function deregisterValidationAttributeChangeHandler(observer) {}
+
+    /**
+     * Returns an object representing the native text input element, with a
+     * similar API shape. The object returned should include the value, disabled
+     * and badInput properties, as well as the checkValidity() function. We never
+     * alter the value within our code, however we do update the disabled
+     * property, so if you choose to duck-type the return value for this method
+     * in your implementation it's important to keep this in mind. Also note that
+     * this method can return null, which the foundation will handle gracefully.
+     * @return {?Element|?NativeInputType}
+     */
+
+  }, {
+    key: 'getNativeInput',
+    value: function getNativeInput() {}
+
+    /**
+     * Returns true if the textfield is focused.
+     * We achieve this via `document.activeElement === this.root_`.
+     * @return {boolean}
+     */
+
+  }, {
+    key: 'isFocused',
+    value: function isFocused() {}
+
+    /**
+     * Returns true if the direction of the root element is set to RTL.
+     * @return {boolean}
+     */
+
+  }, {
+    key: 'isRtl',
+    value: function isRtl() {}
+
+    /**
+     * Activates the line ripple.
+     */
+
+  }, {
+    key: 'activateLineRipple',
+    value: function activateLineRipple() {}
+
+    /**
+     * Deactivates the line ripple.
+     */
+
+  }, {
+    key: 'deactivateLineRipple',
+    value: function deactivateLineRipple() {}
+
+    /**
+     * Sets the transform origin of the line ripple.
+     * @param {number} normalizedX
+     */
+
+  }, {
+    key: 'setLineRippleTransformOrigin',
+    value: function setLineRippleTransformOrigin(normalizedX) {}
+
+    /**
+     * Only implement if label exists.
+     * Shakes label if shouldShake is true.
+     * @param {boolean} shouldShake
+     */
+
+  }, {
+    key: 'shakeLabel',
+    value: function shakeLabel(shouldShake) {}
+
+    /**
+     * Only implement if label exists.
+     * Floats the label above the input element if shouldFloat is true.
+     * @param {boolean} shouldFloat
+     */
+
+  }, {
+    key: 'floatLabel',
+    value: function floatLabel(shouldFloat) {}
+
+    /**
+     * Returns true if label element exists, false if it doesn't.
+     * @return {boolean}
+     */
+
+  }, {
+    key: 'hasLabel',
+    value: function hasLabel() {}
+
+    /**
+     * Only implement if label exists.
+     * Returns width of label in pixels.
+     * @return {number}
+     */
+
+  }, {
+    key: 'getLabelWidth',
+    value: function getLabelWidth() {}
+
+    /**
+     * Returns true if outline element exists, false if it doesn't.
+     * @return {boolean}
+     */
+
+  }, {
+    key: 'hasOutline',
+    value: function hasOutline() {}
+
+    /**
+     * Only implement if outline element exists.
+     * Updates SVG Path and outline element based on the
+     * label element width and RTL context.
+     * @param {number} labelWidth
+     * @param {boolean=} isRtl
+     */
+
+  }, {
+    key: 'notchOutline',
+    value: function notchOutline(labelWidth, isRtl) {}
+
+    /**
+     * Only implement if outline element exists.
+     * Closes notch in outline element.
+     */
+
+  }, {
+    key: 'closeOutline',
+    value: function closeOutline() {}
+  }]);
+
+  return MDCTextFieldAdapter;
+}();
+
+
+
+/***/ }),
+
+/***/ 66:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * @license
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/* eslint no-unused-vars: [2, {"args": "none"}] */
+
+/**
+ * Adapter for MDC Text Field Helper Text.
+ *
+ * Defines the shape of the adapter expected by the foundation. Implement this
+ * adapter to integrate the TextField helper text into your framework. See
+ * https://github.com/material-components/material-components-web/blob/master/docs/authoring-components.md
+ * for more information.
+ *
+ * @record
+ */
+var MDCTextFieldHelperTextAdapter = function () {
+  function MDCTextFieldHelperTextAdapter() {
+    _classCallCheck(this, MDCTextFieldHelperTextAdapter);
+  }
+
+  _createClass(MDCTextFieldHelperTextAdapter, [{
+    key: "addClass",
+
+    /**
+     * Adds a class to the helper text element.
+     * @param {string} className
+     */
+    value: function addClass(className) {}
+
+    /**
+     * Removes a class from the helper text element.
+     * @param {string} className
+     */
+
+  }, {
+    key: "removeClass",
+    value: function removeClass(className) {}
+
+    /**
+     * Returns whether or not the helper text element contains the given class.
+     * @param {string} className
+     * @return {boolean}
+     */
+
+  }, {
+    key: "hasClass",
+    value: function hasClass(className) {}
+
+    /**
+     * Sets an attribute with a given value on the helper text element.
+     * @param {string} attr
+     * @param {string} value
+     */
+
+  }, {
+    key: "setAttr",
+    value: function setAttr(attr, value) {}
+
+    /**
+     * Removes an attribute from the helper text element.
+     * @param {string} attr
+     */
+
+  }, {
+    key: "removeAttr",
+    value: function removeAttr(attr) {}
+
+    /**
+     * Sets the text content for the helper text element.
+     * @param {string} content
+     */
+
+  }, {
+    key: "setContent",
+    value: function setContent(content) {}
+  }]);
+
+  return MDCTextFieldHelperTextAdapter;
+}();
+
+/* unused harmony default export */ var _unused_webpack_default_export = (MDCTextFieldHelperTextAdapter);
+
+/***/ }),
+
+/***/ 67:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * @license
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/* eslint no-unused-vars: [2, {"args": "none"}] */
+
+/**
+ * Adapter for MDC Text Field Icon.
+ *
+ * Defines the shape of the adapter expected by the foundation. Implement this
+ * adapter to integrate the text field icon into your framework. See
+ * https://github.com/material-components/material-components-web/blob/master/docs/authoring-components.md
+ * for more information.
+ *
+ * @record
+ */
+var MDCTextFieldIconAdapter = function () {
+  function MDCTextFieldIconAdapter() {
+    _classCallCheck(this, MDCTextFieldIconAdapter);
+  }
+
+  _createClass(MDCTextFieldIconAdapter, [{
+    key: "getAttr",
+
+    /**
+     * Gets the value of an attribute on the icon element.
+     * @param {string} attr
+     * @return {string}
+     */
+    value: function getAttr(attr) {}
+
+    /**
+     * Sets an attribute on the icon element.
+     * @param {string} attr
+     * @param {string} value
+     */
+
+  }, {
+    key: "setAttr",
+    value: function setAttr(attr, value) {}
+
+    /**
+     * Removes an attribute from the icon element.
+     * @param {string} attr
+     */
+
+  }, {
+    key: "removeAttr",
+    value: function removeAttr(attr) {}
+
+    /**
+     * Sets the text content of the icon element.
+     * @param {string} content
+     */
+
+  }, {
+    key: "setContent",
+    value: function setContent(content) {}
+
+    /**
+     * Registers an event listener on the icon element for a given event.
+     * @param {string} evtType
+     * @param {function(!Event): undefined} handler
+     */
+
+  }, {
+    key: "registerInteractionHandler",
+    value: function registerInteractionHandler(evtType, handler) {}
+
+    /**
+     * Deregisters an event listener on the icon element for a given event.
+     * @param {string} evtType
+     * @param {function(!Event): undefined} handler
+     */
+
+  }, {
+    key: "deregisterInteractionHandler",
+    value: function deregisterInteractionHandler(evtType, handler) {}
+
+    /**
+     * Emits a custom event "MDCTextField:icon" denoting a user has clicked the icon.
+     */
+
+  }, {
+    key: "notifyIconAction",
+    value: function notifyIconAction() {}
+  }]);
+
+  return MDCTextFieldIconAdapter;
+}();
+
+/* unused harmony default export */ var _unused_webpack_default_export = (MDCTextFieldIconAdapter);
+
+/***/ })
+
+/******/ });
+});
+//# sourceMappingURL=mdc.textfield.js.map
\ No newline at end of file
diff --git a/node_modules/@material/textfield/dist/mdc.textfield.min.css b/node_modules/@material/textfield/dist/mdc.textfield.min.css
new file mode 100644
index 0000000..335c3b2
--- /dev/null
+++ b/node_modules/@material/textfield/dist/mdc.textfield.min.css
@@ -0,0 +1,8 @@
+/*!
+ Material Components for the Web
+ Copyright (c) 2018 Google Inc.
+ License: Apache-2.0
+*/
+.mdc-floating-label{font-family:Roboto,sans-serif;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-size:1rem;line-height:1.75rem;font-weight:400;letter-spacing:.00937em;text-decoration:inherit;text-transform:inherit;position:absolute;bottom:8px;left:0;-webkit-transform-origin:left top;transform-origin:left top;transition:color 150ms cubic-bezier(0.4, 0, 0.2, 1),-webkit-transform 150ms cubic-bezier(0.4, 0, 0.2, 1);transition:transform 150ms cubic-bezier(0.4, 0, 0.2, 1),color 150ms cubic-bezier(0.4, 0, 0.2, 1);transition:transform 150ms cubic-bezier(0.4, 0, 0.2, 1),color 150ms cubic-bezier(0.4, 0, 0.2, 1),-webkit-transform 150ms cubic-bezier(0.4, 0, 0.2, 1);line-height:1.15rem;text-overflow:ellipsis;white-space:nowrap;cursor:text;overflow:hidden;will-change:transform}[dir="rtl"] .mdc-floating-label,.mdc-floating-label[dir="rtl"]{right:0;left:auto;-webkit-transform-origin:right top;transform-origin:right top}.mdc-floating-label--float-above{cursor:auto}.mdc-floating-label--float-above{-webkit-transform:translateY(-100%) scale(.75);transform:translateY(-100%) scale(.75)}.mdc-floating-label--shake{-webkit-animation:mdc-floating-label-shake-float-above-standard 250ms 1;animation:mdc-floating-label-shake-float-above-standard 250ms 1}@-webkit-keyframes mdc-floating-label-shake-float-above-standard{0%{-webkit-transform:translateX(calc(0 - 0%)) translateY(-100%) scale(.75);transform:translateX(calc(0 - 0%)) translateY(-100%) scale(.75)}33%{-webkit-animation-timing-function:cubic-bezier(0.5, 0, 0.70173, 0.49582);animation-timing-function:cubic-bezier(0.5, 0, 0.70173, 0.49582);-webkit-transform:translateX(calc(4% - 0%)) translateY(-100%) scale(.75);transform:translateX(calc(4% - 0%)) translateY(-100%) scale(.75)}66%{-webkit-animation-timing-function:cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);animation-timing-function:cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);-webkit-transform:translateX(calc(-4% - 0%)) translateY(-100%) scale(.75);transform:translateX(calc(-4% - 0%)) translateY(-100%) scale(.75)}100%{-webkit-transform:translateX(calc(0 - 0%)) translateY(-100%) scale(.75);transform:translateX(calc(0 - 0%)) translateY(-100%) scale(.75)}}@keyframes mdc-floating-label-shake-float-above-standard{0%{-webkit-transform:translateX(calc(0 - 0%)) translateY(-100%) scale(.75);transform:translateX(calc(0 - 0%)) translateY(-100%) scale(.75)}33%{-webkit-animation-timing-function:cubic-bezier(0.5, 0, 0.70173, 0.49582);animation-timing-function:cubic-bezier(0.5, 0, 0.70173, 0.49582);-webkit-transform:translateX(calc(4% - 0%)) translateY(-100%) scale(.75);transform:translateX(calc(4% - 0%)) translateY(-100%) scale(.75)}66%{-webkit-animation-timing-function:cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);animation-timing-function:cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);-webkit-transform:translateX(calc(-4% - 0%)) translateY(-100%) scale(.75);transform:translateX(calc(-4% - 0%)) translateY(-100%) scale(.75)}100%{-webkit-transform:translateX(calc(0 - 0%)) translateY(-100%) scale(.75);transform:translateX(calc(0 - 0%)) translateY(-100%) scale(.75)}}.mdc-line-ripple{position:absolute;bottom:0;left:0;width:100%;height:2px;-webkit-transform:scaleX(0);transform:scaleX(0);transition:opacity 180ms cubic-bezier(0.4, 0, 0.2, 1),-webkit-transform 180ms cubic-bezier(0.4, 0, 0.2, 1);transition:transform 180ms cubic-bezier(0.4, 0, 0.2, 1),opacity 180ms cubic-bezier(0.4, 0, 0.2, 1);transition:transform 180ms cubic-bezier(0.4, 0, 0.2, 1),opacity 180ms cubic-bezier(0.4, 0, 0.2, 1),-webkit-transform 180ms cubic-bezier(0.4, 0, 0.2, 1);opacity:0;z-index:2}.mdc-line-ripple--active{-webkit-transform:scaleX(1);transform:scaleX(1);opacity:1}.mdc-line-ripple--deactivating{opacity:0}.mdc-notched-outline{position:absolute;top:0;left:0;width:calc(100% - 1px);height:calc(100% - 2px);transition:opacity 150ms cubic-bezier(0.4, 0, 0.2, 1);opacity:0;overflow:hidden}.mdc-notched-outline svg{position:absolute;width:100%;height:100%}.mdc-notched-outline__idle{position:absolute;top:0;left:0;width:calc(100% - 4px);height:calc(100% - 4px);transition:opacity 150ms cubic-bezier(0.4, 0, 0.2, 1),border-color 150ms cubic-bezier(0.4, 0, 0.2, 1);border:1px solid;opacity:1}.mdc-notched-outline__path{stroke-width:1px;transition:stroke 150ms cubic-bezier(0.4, 0, 0.2, 1),stroke-width 150ms cubic-bezier(0.4, 0, 0.2, 1);fill:transparent}.mdc-notched-outline--notched{opacity:1}.mdc-notched-outline--notched ~ .mdc-notched-outline__idle{opacity:0}@-webkit-keyframes mdc-ripple-fg-radius-in{from{-webkit-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-transform:translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);transform:translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1)}to{-webkit-transform:translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));transform:translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1))}}@keyframes mdc-ripple-fg-radius-in{from{-webkit-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-transform:translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);transform:translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1)}to{-webkit-transform:translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));transform:translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1))}}@-webkit-keyframes mdc-ripple-fg-opacity-in{from{-webkit-animation-timing-function:linear;animation-timing-function:linear;opacity:0}to{opacity:var(--mdc-ripple-fg-opacity, 0)}}@keyframes mdc-ripple-fg-opacity-in{from{-webkit-animation-timing-function:linear;animation-timing-function:linear;opacity:0}to{opacity:var(--mdc-ripple-fg-opacity, 0)}}@-webkit-keyframes mdc-ripple-fg-opacity-out{from{-webkit-animation-timing-function:linear;animation-timing-function:linear;opacity:var(--mdc-ripple-fg-opacity, 0)}to{opacity:0}}@keyframes mdc-ripple-fg-opacity-out{from{-webkit-animation-timing-function:linear;animation-timing-function:linear;opacity:var(--mdc-ripple-fg-opacity, 0)}to{opacity:0}}.mdc-ripple-surface--test-edge-var-bug{--mdc-ripple-surface-test-edge-var: 1px solid #000;visibility:hidden}.mdc-ripple-surface--test-edge-var-bug::before{border:var(--mdc-ripple-surface-test-edge-var)}.mdc-text-field-helper-text{font-family:Roboto,sans-serif;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-size:.75rem;line-height:1.25rem;font-weight:400;letter-spacing:.03333em;text-decoration:inherit;text-transform:inherit;margin:0;transition:opacity 180ms cubic-bezier(0.4, 0, 0.2, 1);opacity:0;will-change:opacity}.mdc-text-field+.mdc-text-field-helper-text{margin-bottom:8px}.mdc-text-field-helper-text--persistent{transition:none;opacity:1;will-change:initial}.mdc-text-field--with-leading-icon .mdc-text-field__icon,.mdc-text-field--with-trailing-icon .mdc-text-field__icon{position:absolute;bottom:16px;cursor:pointer}.mdc-text-field__icon:not([tabindex]),.mdc-text-field__icon[tabindex="-1"]{cursor:default;pointer-events:none}.mdc-text-field{display:inline-block;position:relative;margin-bottom:8px;will-change:opacity, transform, color}.mdc-text-field:not(.mdc-text-field--disabled):not(.mdc-text-field--outlined):not(.mdc-text-field--textarea) .mdc-text-field__input{border-bottom-color:rgba(0,0,0,0.42)}.mdc-text-field:not(.mdc-text-field--disabled):not(.mdc-text-field--outlined):not(.mdc-text-field--textarea) .mdc-text-field__input:hover{border-bottom-color:rgba(0,0,0,0.87)}.mdc-text-field .mdc-line-ripple{background-color:#6200ee;background-color:var(--mdc-theme-primary, #6200ee)}.mdc-text-field:not(.mdc-text-field--disabled) .mdc-text-field__input{color:rgba(0,0,0,0.87)}.mdc-text-field:not(.mdc-text-field--disabled) .mdc-floating-label{color:rgba(0,0,0,0.6)}.mdc-text-field:not(.mdc-text-field--disabled) .mdc-text-field__input::-webkit-input-placeholder{color:rgba(0,0,0,0.6)}.mdc-text-field:not(.mdc-text-field--disabled) .mdc-text-field__input:-ms-input-placeholder{color:rgba(0,0,0,0.6)}.mdc-text-field:not(.mdc-text-field--disabled) .mdc-text-field__input::-ms-input-placeholder{color:rgba(0,0,0,0.6)}.mdc-text-field:not(.mdc-text-field--disabled) .mdc-text-field__input::placeholder{color:rgba(0,0,0,0.6)}.mdc-text-field:not(.mdc-text-field--disabled)+.mdc-text-field-helper-text{color:rgba(0,0,0,0.6)}.mdc-text-field:not(.mdc-text-field--disabled):not(.mdc-text-field--textarea){border-bottom-color:rgba(0,0,0,0.12)}.mdc-text-field:not(.mdc-text-field--disabled) .mdc-text-field__icon{color:rgba(0,0,0,0.54)}.mdc-text-field .mdc-text-field__input{caret-color:#6200ee;caret-color:var(--mdc-theme-primary, #6200ee)}.mdc-text-field__input{font-family:Roboto,sans-serif;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-size:1rem;line-height:1.75rem;font-weight:400;letter-spacing:.00937em;text-decoration:inherit;text-transform:inherit;width:100%;height:30px;padding:20px 0 1px;transition:opacity 180ms cubic-bezier(0.4, 0, 0.2, 1);border:none;border-bottom:1px solid;border-radius:0;background:none;-webkit-appearance:none;-moz-appearance:none;appearance:none}.mdc-text-field__input::-webkit-input-placeholder{transition:color 180ms cubic-bezier(0.4, 0, 0.2, 1);opacity:1}.mdc-text-field__input:-ms-input-placeholder{transition:color 180ms cubic-bezier(0.4, 0, 0.2, 1);opacity:1}.mdc-text-field__input::-ms-input-placeholder{transition:color 180ms cubic-bezier(0.4, 0, 0.2, 1);opacity:1}.mdc-text-field__input::placeholder{transition:color 180ms cubic-bezier(0.4, 0, 0.2, 1);opacity:1}.mdc-text-field__input:focus{outline:none}.mdc-text-field__input:invalid{box-shadow:none}.mdc-text-field__input:-webkit-autofill+.mdc-floating-label{-webkit-transform:translateY(-100%) scale(0.75);transform:translateY(-100%) scale(0.75);cursor:auto}.mdc-text-field--outlined{height:56px;border:none}.mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-notched-outline__idle{border-color:rgba(0,0,0,0.24)}.mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-notched-outline__path{stroke:rgba(0,0,0,0.24)}.mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused) .mdc-text-field__input:hover ~ .mdc-notched-outline__idle,.mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused) .mdc-text-field__icon:hover ~ .mdc-notched-outline__idle{border-color:rgba(0,0,0,0.87)}.mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused) .mdc-text-field__input:hover ~ .mdc-notched-outline .mdc-notched-outline__path,.mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused) .mdc-text-field__icon:hover ~ .mdc-notched-outline .mdc-notched-outline__path{stroke:rgba(0,0,0,0.87)}.mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mdc-notched-outline__path{stroke:#6200ee;stroke:var(--mdc-theme-primary, #6200ee)}.mdc-text-field--outlined .mdc-floating-label--float-above{-webkit-transform:translateY(-130%) scale(.75);transform:translateY(-130%) scale(.75)}.mdc-text-field--outlined .mdc-floating-label--shake{-webkit-animation:mdc-floating-label-shake-float-above-text-field-outlined 250ms 1;animation:mdc-floating-label-shake-float-above-text-field-outlined 250ms 1}.mdc-text-field--outlined .mdc-notched-outline{border-radius:4px}.mdc-text-field--outlined .mdc-notched-outline__idle{border-radius:4px}.mdc-text-field--outlined .mdc-text-field__input{display:flex;padding:12px;border:none !important;background-color:transparent;z-index:1}.mdc-text-field--outlined .mdc-floating-label{left:16px;right:initial;position:absolute;bottom:20px}[dir="rtl"] .mdc-text-field--outlined .mdc-floating-label,.mdc-text-field--outlined .mdc-floating-label[dir="rtl"]{left:initial;right:16px}.mdc-text-field--outlined .mdc-text-field__icon{z-index:2}.mdc-text-field--outlined.mdc-text-field--focused .mdc-notched-outline__path{stroke-width:2px}.mdc-text-field--outlined.mdc-text-field--disabled .mdc-text-field__input{color:rgba(0,0,0,0.6)}.mdc-text-field--outlined.mdc-text-field--disabled .mdc-notched-outline__idle{border-color:rgba(0,0,0,0.06)}.mdc-text-field--outlined.mdc-text-field--disabled .mdc-notched-outline__path{stroke:rgba(0,0,0,0.06)}.mdc-text-field--outlined.mdc-text-field--disabled .mdc-text-field__input{border-bottom:none}.mdc-text-field--outlined.mdc-text-field--dense{height:48px}.mdc-text-field--outlined.mdc-text-field--dense .mdc-floating-label--float-above{-webkit-transform:translateY(-110%) scale(.923);transform:translateY(-110%) scale(.923)}.mdc-text-field--outlined.mdc-text-field--dense .mdc-floating-label--shake{-webkit-animation:mdc-floating-label-shake-float-above-text-field-outlined-dense 250ms 1;animation:mdc-floating-label-shake-float-above-text-field-outlined-dense 250ms 1}.mdc-text-field--outlined.mdc-text-field--dense .mdc-text-field__input{padding:12px 12px 7px}.mdc-text-field--outlined.mdc-text-field--dense .mdc-floating-label{bottom:16px}.mdc-text-field--outlined.mdc-text-field--dense .mdc-text-field__icon{top:12px}.mdc-text-field--box{--mdc-ripple-fg-size: 0;--mdc-ripple-left: 0;--mdc-ripple-top: 0;--mdc-ripple-fg-scale: 1;--mdc-ripple-fg-translate-end: 0;--mdc-ripple-fg-translate-start: 0;-webkit-tap-highlight-color:rgba(0,0,0,0);will-change:transform, opacity;border-radius:4px 4px 0 0;display:inline-flex;position:relative;height:56px;margin-top:16px;overflow:hidden}.mdc-text-field--box::before,.mdc-text-field--box::after{position:absolute;border-radius:50%;opacity:0;pointer-events:none;content:""}.mdc-text-field--box::before{transition:opacity 15ms linear;z-index:1}.mdc-text-field--box.mdc-ripple-upgraded::before{-webkit-transform:scale(var(--mdc-ripple-fg-scale, 1));transform:scale(var(--mdc-ripple-fg-scale, 1))}.mdc-text-field--box.mdc-ripple-upgraded::after{top:0;left:0;-webkit-transform:scale(0);transform:scale(0);-webkit-transform-origin:center center;transform-origin:center center}.mdc-text-field--box.mdc-ripple-upgraded--unbounded::after{top:var(--mdc-ripple-top, 0);left:var(--mdc-ripple-left, 0)}.mdc-text-field--box.mdc-ripple-upgraded--foreground-activation::after{-webkit-animation:225ms mdc-ripple-fg-radius-in forwards,75ms mdc-ripple-fg-opacity-in forwards;animation:225ms mdc-ripple-fg-radius-in forwards,75ms mdc-ripple-fg-opacity-in forwards}.mdc-text-field--box.mdc-ripple-upgraded--foreground-deactivation::after{-webkit-animation:150ms mdc-ripple-fg-opacity-out;animation:150ms mdc-ripple-fg-opacity-out;-webkit-transform:translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));transform:translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1))}.mdc-text-field--box::before,.mdc-text-field--box::after{background-color:rgba(0,0,0,0.87)}.mdc-text-field--box:hover::before{opacity:.04}.mdc-text-field--box:not(.mdc-ripple-upgraded):focus::before,.mdc-text-field--box.mdc-ripple-upgraded--background-focused::before{transition-duration:75ms;opacity:.12}.mdc-text-field--box::before,.mdc-text-field--box::after{top:calc(50% - 100%);left:calc(50% - 100%);width:200%;height:200%}.mdc-text-field--box.mdc-ripple-upgraded::after{width:var(--mdc-ripple-fg-size, 100%);height:var(--mdc-ripple-fg-size, 100%)}.mdc-text-field--box:not(.mdc-text-field--disabled){background-color:#f5f5f5}.mdc-text-field--box .mdc-floating-label--float-above{-webkit-transform:translateY(-50%) scale(.75);transform:translateY(-50%) scale(.75)}.mdc-text-field--box .mdc-floating-label--shake{-webkit-animation:mdc-floating-label-shake-float-above-text-field-box 250ms 1;animation:mdc-floating-label-shake-float-above-text-field-box 250ms 1}.mdc-text-field--box .mdc-text-field__input{align-self:flex-end;box-sizing:border-box;height:100%;padding:20px 16px 0}.mdc-text-field--box .mdc-floating-label{left:16px;right:initial;position:absolute;bottom:20px;width:calc(100% - 48px);text-overflow:ellipsis;white-space:nowrap;pointer-events:none;overflow:hidden;will-change:transform}[dir="rtl"] .mdc-text-field--box .mdc-floating-label,.mdc-text-field--box .mdc-floating-label[dir="rtl"]{left:initial;right:16px}.mdc-text-field--box.mdc-text-field--disabled{background-color:#fafafa;border-bottom:none}.mdc-text-field--box.mdc-text-field--disabled .mdc-text-field__input{border-bottom-color:rgba(0,0,0,0.06)}.mdc-text-field--box.mdc-text-field--disabled:not(.mdc-text-field--disabled) .mdc-floating-label{color:rgba(0,0,0,0.37)}.mdc-text-field--box.mdc-text-field--disabled:not(.mdc-text-field--disabled) .mdc-text-field__input::-webkit-input-placeholder{color:rgba(0,0,0,0.37)}.mdc-text-field--box.mdc-text-field--disabled:not(.mdc-text-field--disabled) .mdc-text-field__input:-ms-input-placeholder{color:rgba(0,0,0,0.37)}.mdc-text-field--box.mdc-text-field--disabled:not(.mdc-text-field--disabled) .mdc-text-field__input::-ms-input-placeholder{color:rgba(0,0,0,0.37)}.mdc-text-field--box.mdc-text-field--disabled:not(.mdc-text-field--disabled) .mdc-text-field__input::placeholder{color:rgba(0,0,0,0.37)}.mdc-text-field--box.mdc-text-field--dense .mdc-floating-label--float-above{-webkit-transform:translateY(-70%) scale(.923);transform:translateY(-70%) scale(.923)}.mdc-text-field--box.mdc-text-field--dense .mdc-floating-label--shake{-webkit-animation:mdc-floating-label-shake-float-above-text-field-box-dense 250ms 1;animation:mdc-floating-label-shake-float-above-text-field-box-dense 250ms 1}.mdc-text-field--box.mdc-text-field--dense .mdc-text-field__input{padding:12px 12px 0}.mdc-text-field--with-leading-icon .mdc-text-field__icon{left:15px;right:initial}[dir="rtl"] .mdc-text-field--with-leading-icon .mdc-text-field__icon,.mdc-text-field--with-leading-icon .mdc-text-field__icon[dir="rtl"]{left:initial;right:15px}.mdc-text-field--with-leading-icon .mdc-text-field__input{padding-left:48px;padding-right:15px}[dir="rtl"] .mdc-text-field--with-leading-icon .mdc-text-field__input,.mdc-text-field--with-leading-icon .mdc-text-field__input[dir="rtl"]{padding-left:15px;padding-right:48px}.mdc-text-field--with-leading-icon .mdc-floating-label{left:48px;right:initial}[dir="rtl"] .mdc-text-field--with-leading-icon .mdc-floating-label,.mdc-text-field--with-leading-icon .mdc-floating-label[dir="rtl"]{left:initial;right:48px}.mdc-text-field--with-leading-icon.mdc-text-field--outlined .mdc-floating-label--float-above{-webkit-transform:translateY(-130%) translateX(-32px) scale(.75);transform:translateY(-130%) translateX(-32px) scale(.75)}[dir="rtl"] .mdc-text-field--with-leading-icon.mdc-text-field--outlined .mdc-floating-label--float-above,.mdc-text-field--with-leading-icon.mdc-text-field--outlined .mdc-floating-label--float-above[dir="rtl"]{-webkit-transform:translateY(-130%) translateX(32px) scale(.75);transform:translateY(-130%) translateX(32px) scale(.75)}.mdc-text-field--with-leading-icon.mdc-text-field--outlined .mdc-floating-label--shake{-webkit-animation:mdc-floating-label-shake-float-above-text-field-outlined-leading-icon 250ms 1;animation:mdc-floating-label-shake-float-above-text-field-outlined-leading-icon 250ms 1}[dir="rtl"] .mdc-text-field--with-leading-icon.mdc-text-field--outlined .mdc-floating-label--shake,.mdc-text-field--with-leading-icon.mdc-text-field--outlined[dir="rtl"] .mdc-floating-label--shake{-webkit-animation:mdc-floating-label-shake-float-above-text-field-outlined-leading-icon-rtl 250ms 1;animation:mdc-floating-label-shake-float-above-text-field-outlined-leading-icon-rtl 250ms 1}.mdc-text-field--with-leading-icon.mdc-text-field--outlined.mdc-text-field--dense .mdc-floating-label--float-above{-webkit-transform:translateY(-110%) translateX(-21px) scale(.923);transform:translateY(-110%) translateX(-21px) scale(.923)}[dir="rtl"] .mdc-text-field--with-leading-icon.mdc-text-field--outlined.mdc-text-field--dense .mdc-floating-label--float-above,.mdc-text-field--with-leading-icon.mdc-text-field--outlined.mdc-text-field--dense .mdc-floating-label--float-above[dir="rtl"]{-webkit-transform:translateY(-110%) translateX(21px) scale(.923);transform:translateY(-110%) translateX(21px) scale(.923)}.mdc-text-field--with-leading-icon.mdc-text-field--outlined.mdc-text-field--dense .mdc-floating-label--shake{-webkit-animation:mdc-floating-label-shake-float-above-text-field-outlined-leading-icon-dense 250ms 1;animation:mdc-floating-label-shake-float-above-text-field-outlined-leading-icon-dense 250ms 1}[dir="rtl"] .mdc-text-field--with-leading-icon.mdc-text-field--outlined.mdc-text-field--dense .mdc-floating-label--shake,.mdc-text-field--with-leading-icon.mdc-text-field--outlined.mdc-text-field--dense[dir="rtl"] .mdc-floating-label--shake{-webkit-animation:mdc-floating-label-shake-float-above-text-field-outlined-leading-icon-dense-rtl 250ms 1;animation:mdc-floating-label-shake-float-above-text-field-outlined-leading-icon-dense-rtl 250ms 1}.mdc-text-field--with-trailing-icon .mdc-text-field__icon{left:initial;right:15px}[dir="rtl"] .mdc-text-field--with-trailing-icon .mdc-text-field__icon,.mdc-text-field--with-trailing-icon .mdc-text-field__icon[dir="rtl"]{left:15px;right:initial}.mdc-text-field--with-trailing-icon .mdc-text-field__input{padding-left:15px;padding-right:48px}[dir="rtl"] .mdc-text-field--with-trailing-icon .mdc-text-field__input,.mdc-text-field--with-trailing-icon .mdc-text-field__input[dir="rtl"]{padding-left:48px;padding-right:15px}.mdc-text-field--with-leading-icon.mdc-text-field--dense .mdc-text-field__icon,.mdc-text-field--with-trailing-icon.mdc-text-field--dense .mdc-text-field__icon{bottom:16px;-webkit-transform:scale(0.8);transform:scale(0.8)}.mdc-text-field--with-leading-icon.mdc-text-field--dense .mdc-text-field__icon{left:12px;right:initial}[dir="rtl"] .mdc-text-field--with-leading-icon.mdc-text-field--dense .mdc-text-field__icon,.mdc-text-field--with-leading-icon.mdc-text-field--dense .mdc-text-field__icon[dir="rtl"]{left:initial;right:12px}.mdc-text-field--with-leading-icon.mdc-text-field--dense .mdc-text-field__input{padding-left:38px;padding-right:12px}[dir="rtl"] .mdc-text-field--with-leading-icon.mdc-text-field--dense .mdc-text-field__input,.mdc-text-field--with-leading-icon.mdc-text-field--dense .mdc-text-field__input[dir="rtl"]{padding-left:12px;padding-right:38px}.mdc-text-field--with-leading-icon.mdc-text-field--dense .mdc-floating-label{left:38px;right:initial}[dir="rtl"] .mdc-text-field--with-leading-icon.mdc-text-field--dense .mdc-floating-label,.mdc-text-field--with-leading-icon.mdc-text-field--dense .mdc-floating-label[dir="rtl"]{left:initial;right:38px}.mdc-text-field--with-trailing-icon.mdc-text-field--dense .mdc-text-field__icon{left:initial;right:12px}[dir="rtl"] .mdc-text-field--with-trailing-icon.mdc-text-field--dense .mdc-text-field__icon,.mdc-text-field--with-trailing-icon.mdc-text-field--dense .mdc-text-field__icon[dir="rtl"]{left:12px;right:initial}.mdc-text-field--with-trailing-icon.mdc-text-field--dense .mdc-text-field__input{padding-left:12px;padding-right:38px}[dir="rtl"] .mdc-text-field--with-trailing-icon.mdc-text-field--dense .mdc-text-field__input,.mdc-text-field--with-trailing-icon.mdc-text-field--dense .mdc-text-field__input[dir="rtl"]{padding-left:38px;padding-right:12px}.mdc-text-field--upgraded:not(.mdc-text-field--fullwidth):not(.mdc-text-field--box){display:inline-flex;position:relative;align-items:flex-end;box-sizing:border-box;margin-top:16px}.mdc-text-field--upgraded:not(.mdc-text-field--fullwidth):not(.mdc-text-field--box):not(.mdc-text-field--textarea):not(.mdc-text-field--outlined){height:48px}.mdc-text-field--dense{margin-top:12px;margin-bottom:4px}.mdc-text-field--dense .mdc-floating-label--float-above{-webkit-transform:translateY(-110%) scale(.923);transform:translateY(-110%) scale(.923)}.mdc-text-field--dense .mdc-floating-label{font-size:.813rem}.mdc-text-field__input:required+.mdc-floating-label::after{margin-left:1px;content:"*"}.mdc-text-field--textarea{border-radius:4px;display:flex;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;height:initial;transition:none;border:1px solid;overflow:hidden}.mdc-text-field--textarea .mdc-floating-label{border-radius:4px 4px 0 0}.mdc-text-field--textarea .mdc-text-field__input{border-radius:2px}.mdc-text-field--textarea:not(.mdc-text-field--disabled){border-color:rgba(0,0,0,0.73)}.mdc-text-field--textarea:not(.mdc-text-field--disabled) .mdc-text-field__input:focus{border-color:rgba(0,0,0,0.73)}.mdc-text-field--textarea .mdc-floating-label--float-above{-webkit-transform:translateY(-50%) scale(.923);transform:translateY(-50%) scale(.923)}.mdc-text-field--textarea .mdc-floating-label--shake{-webkit-animation:mdc-floating-label-shake-float-above-textarea 250ms 1;animation:mdc-floating-label-shake-float-above-textarea 250ms 1}.mdc-text-field--textarea .mdc-text-field__input{height:auto;margin:0;padding:16px;padding-top:32px;border:1px solid transparent}.mdc-text-field--textarea .mdc-floating-label{background-color:#fff;left:1px;right:0;margin-left:8px;margin-right:0;top:18px;bottom:auto;margin-top:2px;padding:12px 8px 8px 8px;line-height:1.15;pointer-events:none}[dir="rtl"] .mdc-text-field--textarea .mdc-floating-label,.mdc-text-field--textarea .mdc-floating-label[dir="rtl"]{left:0;right:1px}[dir="rtl"] .mdc-text-field--textarea .mdc-floating-label,.mdc-text-field--textarea .mdc-floating-label[dir="rtl"]{margin-left:0;margin-right:8px}.mdc-text-field--fullwidth{width:100%}.mdc-text-field--fullwidth .mdc-text-field__input{resize:vertical}.mdc-text-field--fullwidth:not(.mdc-text-field--textarea){display:block;box-sizing:border-box;height:56px;margin:0;border:none;border-bottom:1px solid;outline:none}.mdc-text-field--fullwidth:not(.mdc-text-field--textarea) .mdc-text-field__input{width:100%;height:100%;padding:0;resize:none;border:none !important}.mdc-text-field--fullwidth.mdc-text-field--invalid:not(.mdc-text-field--disabled):not(.mdc-text-field--textarea){border-bottom-color:#b00020}.mdc-text-field--dense+.mdc-text-field-helper-text{margin-bottom:4px}.mdc-text-field--box+.mdc-text-field-helper-text,.mdc-text-field--outlined+.mdc-text-field-helper-text,.mdc-text-field--textarea+.mdc-text-field-helper-text{margin-right:16px;margin-left:16px}.mdc-form-field>.mdc-text-field+label{align-self:flex-start}.mdc-text-field--focused:not(.mdc-text-field--disabled) .mdc-floating-label{color:rgba(98,0,238,0.87)}.mdc-text-field--focused:not(.mdc-text-field--disabled) .mdc-text-field__input::-webkit-input-placeholder{color:rgba(98,0,238,0.87)}.mdc-text-field--focused:not(.mdc-text-field--disabled) .mdc-text-field__input:-ms-input-placeholder{color:rgba(98,0,238,0.87)}.mdc-text-field--focused:not(.mdc-text-field--disabled) .mdc-text-field__input::-ms-input-placeholder{color:rgba(98,0,238,0.87)}.mdc-text-field--focused:not(.mdc-text-field--disabled) .mdc-text-field__input::placeholder{color:rgba(98,0,238,0.87)}.mdc-text-field--focused .mdc-text-field__input:required+.mdc-floating-label::after{color:#b00020}.mdc-text-field--focused+.mdc-text-field-helper-text:not(.mdc-text-field-helper-text--validation-msg){opacity:1}.mdc-text-field--textarea.mdc-text-field--focused:not(.mdc-text-field--disabled){border-color:#6200ee;border-color:var(--mdc-theme-primary, #6200ee)}.mdc-text-field--textarea.mdc-text-field--focused:not(.mdc-text-field--disabled) .mdc-text-field__input:focus{border-color:#6200ee;border-color:var(--mdc-theme-primary, #6200ee)}.mdc-text-field--invalid:not(.mdc-text-field--disabled):not(.mdc-text-field--outlined):not(.mdc-text-field--textarea) .mdc-text-field__input{border-bottom-color:#b00020}.mdc-text-field--invalid:not(.mdc-text-field--disabled):not(.mdc-text-field--outlined):not(.mdc-text-field--textarea) .mdc-text-field__input:hover{border-bottom-color:#b00020}.mdc-text-field--invalid:not(.mdc-text-field--disabled) .mdc-line-ripple{background-color:#b00020}.mdc-text-field--invalid:not(.mdc-text-field--disabled) .mdc-floating-label{color:#b00020}.mdc-text-field--invalid:not(.mdc-text-field--disabled) .mdc-text-field__input::-webkit-input-placeholder{color:#b00020}.mdc-text-field--invalid:not(.mdc-text-field--disabled) .mdc-text-field__input:-ms-input-placeholder{color:#b00020}.mdc-text-field--invalid:not(.mdc-text-field--disabled) .mdc-text-field__input::-ms-input-placeholder{color:#b00020}.mdc-text-field--invalid:not(.mdc-text-field--disabled) .mdc-text-field__input::placeholder{color:#b00020}.mdc-text-field--invalid:not(.mdc-text-field--disabled).mdc-text-field--invalid+.mdc-text-field-helper-text--validation-msg{color:#b00020}.mdc-text-field--invalid .mdc-text-field__input{caret-color:#b00020}.mdc-text-field--invalid.mdc-text-field--with-trailing-icon:not(.mdc-text-field--disabled) .mdc-text-field__icon{color:#b00020}.mdc-text-field--invalid+.mdc-text-field-helper-text--validation-msg{opacity:1}.mdc-text-field--textarea.mdc-text-field--invalid:not(.mdc-text-field--disabled){border-color:#b00020}.mdc-text-field--textarea.mdc-text-field--invalid:not(.mdc-text-field--disabled) .mdc-text-field__input:focus{border-color:#b00020}.mdc-text-field--outlined.mdc-text-field--invalid:not(.mdc-text-field--disabled) .mdc-notched-outline__idle{border-color:#b00020}.mdc-text-field--outlined.mdc-text-field--invalid:not(.mdc-text-field--disabled) .mdc-notched-outline__path{stroke:#b00020}.mdc-text-field--outlined.mdc-text-field--invalid:not(.mdc-text-field--disabled):not(.mdc-text-field--focused) .mdc-text-field__input:hover ~ .mdc-notched-outline__idle,.mdc-text-field--outlined.mdc-text-field--invalid:not(.mdc-text-field--disabled):not(.mdc-text-field--focused) .mdc-text-field__icon:hover ~ .mdc-notched-outline__idle{border-color:#b00020}.mdc-text-field--outlined.mdc-text-field--invalid:not(.mdc-text-field--disabled):not(.mdc-text-field--focused) .mdc-text-field__input:hover ~ .mdc-notched-outline .mdc-notched-outline__path,.mdc-text-field--outlined.mdc-text-field--invalid:not(.mdc-text-field--disabled):not(.mdc-text-field--focused) .mdc-text-field__icon:hover ~ .mdc-notched-outline .mdc-notched-outline__path{stroke:#b00020}.mdc-text-field--outlined.mdc-text-field--invalid:not(.mdc-text-field--disabled).mdc-text-field--focused .mdc-notched-outline__path{stroke:#b00020}.mdc-text-field--disabled{pointer-events:none}.mdc-text-field--disabled .mdc-text-field__input{border-bottom-color:rgba(35,31,32,0.26)}.mdc-text-field--disabled .mdc-text-field__input{color:rgba(0,0,0,0.37)}.mdc-text-field--disabled .mdc-floating-label{color:rgba(0,0,0,0.37)}.mdc-text-field--disabled .mdc-text-field__input::-webkit-input-placeholder{color:rgba(0,0,0,0.37)}.mdc-text-field--disabled .mdc-text-field__input:-ms-input-placeholder{color:rgba(0,0,0,0.37)}.mdc-text-field--disabled .mdc-text-field__input::-ms-input-placeholder{color:rgba(0,0,0,0.37)}.mdc-text-field--disabled .mdc-text-field__input::placeholder{color:rgba(0,0,0,0.37)}.mdc-text-field--disabled+.mdc-text-field-helper-text{color:rgba(0,0,0,0.37)}.mdc-text-field--disabled .mdc-text-field__icon{color:rgba(0,0,0,0.3)}.mdc-text-field--disabled:not(.mdc-text-field--textarea){border-bottom-color:rgba(0,0,0,0.12)}.mdc-text-field--disabled .mdc-text-field__input{border-bottom:1px dotted}.mdc-text-field--disabled .mdc-floating-label{cursor:default}.mdc-text-field--textarea.mdc-text-field--disabled{border-color:rgba(35,31,32,0.26);background-color:#f9f9f9;border-style:solid}.mdc-text-field--textarea.mdc-text-field--disabled .mdc-text-field__input:focus{border-color:rgba(35,31,32,0.26)}.mdc-text-field--textarea.mdc-text-field--disabled .mdc-text-field__input{border:1px solid transparent}.mdc-text-field--textarea.mdc-text-field--disabled .mdc-floating-label{background-color:#f9f9f9}@-webkit-keyframes mdc-floating-label-shake-float-above-text-field-box{0%{-webkit-transform:translateX(calc(0 - 0%)) translateY(-50%) scale(.75);transform:translateX(calc(0 - 0%)) translateY(-50%) scale(.75)}33%{-webkit-animation-timing-function:cubic-bezier(0.5, 0, 0.70173, 0.49582);animation-timing-function:cubic-bezier(0.5, 0, 0.70173, 0.49582);-webkit-transform:translateX(calc(4% - 0%)) translateY(-50%) scale(.75);transform:translateX(calc(4% - 0%)) translateY(-50%) scale(.75)}66%{-webkit-animation-timing-function:cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);animation-timing-function:cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);-webkit-transform:translateX(calc(-4% - 0%)) translateY(-50%) scale(.75);transform:translateX(calc(-4% - 0%)) translateY(-50%) scale(.75)}100%{-webkit-transform:translateX(calc(0 - 0%)) translateY(-50%) scale(.75);transform:translateX(calc(0 - 0%)) translateY(-50%) scale(.75)}}@keyframes mdc-floating-label-shake-float-above-text-field-box{0%{-webkit-transform:translateX(calc(0 - 0%)) translateY(-50%) scale(.75);transform:translateX(calc(0 - 0%)) translateY(-50%) scale(.75)}33%{-webkit-animation-timing-function:cubic-bezier(0.5, 0, 0.70173, 0.49582);animation-timing-function:cubic-bezier(0.5, 0, 0.70173, 0.49582);-webkit-transform:translateX(calc(4% - 0%)) translateY(-50%) scale(.75);transform:translateX(calc(4% - 0%)) translateY(-50%) scale(.75)}66%{-webkit-animation-timing-function:cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);animation-timing-function:cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);-webkit-transform:translateX(calc(-4% - 0%)) translateY(-50%) scale(.75);transform:translateX(calc(-4% - 0%)) translateY(-50%) scale(.75)}100%{-webkit-transform:translateX(calc(0 - 0%)) translateY(-50%) scale(.75);transform:translateX(calc(0 - 0%)) translateY(-50%) scale(.75)}}@-webkit-keyframes mdc-floating-label-shake-float-above-text-field-box-dense{0%{-webkit-transform:translateX(calc(0 - 0%)) translateY(-70%) scale(.923);transform:translateX(calc(0 - 0%)) translateY(-70%) scale(.923)}33%{-webkit-animation-timing-function:cubic-bezier(0.5, 0, 0.70173, 0.49582);animation-timing-function:cubic-bezier(0.5, 0, 0.70173, 0.49582);-webkit-transform:translateX(calc(4% - 0%)) translateY(-70%) scale(.923);transform:translateX(calc(4% - 0%)) translateY(-70%) scale(.923)}66%{-webkit-animation-timing-function:cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);animation-timing-function:cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);-webkit-transform:translateX(calc(-4% - 0%)) translateY(-70%) scale(.923);transform:translateX(calc(-4% - 0%)) translateY(-70%) scale(.923)}100%{-webkit-transform:translateX(calc(0 - 0%)) translateY(-70%) scale(.923);transform:translateX(calc(0 - 0%)) translateY(-70%) scale(.923)}}@keyframes mdc-floating-label-shake-float-above-text-field-box-dense{0%{-webkit-transform:translateX(calc(0 - 0%)) translateY(-70%) scale(.923);transform:translateX(calc(0 - 0%)) translateY(-70%) scale(.923)}33%{-webkit-animation-timing-function:cubic-bezier(0.5, 0, 0.70173, 0.49582);animation-timing-function:cubic-bezier(0.5, 0, 0.70173, 0.49582);-webkit-transform:translateX(calc(4% - 0%)) translateY(-70%) scale(.923);transform:translateX(calc(4% - 0%)) translateY(-70%) scale(.923)}66%{-webkit-animation-timing-function:cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);animation-timing-function:cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);-webkit-transform:translateX(calc(-4% - 0%)) translateY(-70%) scale(.923);transform:translateX(calc(-4% - 0%)) translateY(-70%) scale(.923)}100%{-webkit-transform:translateX(calc(0 - 0%)) translateY(-70%) scale(.923);transform:translateX(calc(0 - 0%)) translateY(-70%) scale(.923)}}@-webkit-keyframes mdc-floating-label-shake-float-above-text-field-outlined{0%{-webkit-transform:translateX(calc(0 - 0%)) translateY(-130%) scale(.75);transform:translateX(calc(0 - 0%)) translateY(-130%) scale(.75)}33%{-webkit-animation-timing-function:cubic-bezier(0.5, 0, 0.70173, 0.49582);animation-timing-function:cubic-bezier(0.5, 0, 0.70173, 0.49582);-webkit-transform:translateX(calc(4% - 0%)) translateY(-130%) scale(.75);transform:translateX(calc(4% - 0%)) translateY(-130%) scale(.75)}66%{-webkit-animation-timing-function:cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);animation-timing-function:cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);-webkit-transform:translateX(calc(-4% - 0%)) translateY(-130%) scale(.75);transform:translateX(calc(-4% - 0%)) translateY(-130%) scale(.75)}100%{-webkit-transform:translateX(calc(0 - 0%)) translateY(-130%) scale(.75);transform:translateX(calc(0 - 0%)) translateY(-130%) scale(.75)}}@keyframes mdc-floating-label-shake-float-above-text-field-outlined{0%{-webkit-transform:translateX(calc(0 - 0%)) translateY(-130%) scale(.75);transform:translateX(calc(0 - 0%)) translateY(-130%) scale(.75)}33%{-webkit-animation-timing-function:cubic-bezier(0.5, 0, 0.70173, 0.49582);animation-timing-function:cubic-bezier(0.5, 0, 0.70173, 0.49582);-webkit-transform:translateX(calc(4% - 0%)) translateY(-130%) scale(.75);transform:translateX(calc(4% - 0%)) translateY(-130%) scale(.75)}66%{-webkit-animation-timing-function:cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);animation-timing-function:cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);-webkit-transform:translateX(calc(-4% - 0%)) translateY(-130%) scale(.75);transform:translateX(calc(-4% - 0%)) translateY(-130%) scale(.75)}100%{-webkit-transform:translateX(calc(0 - 0%)) translateY(-130%) scale(.75);transform:translateX(calc(0 - 0%)) translateY(-130%) scale(.75)}}@-webkit-keyframes mdc-floating-label-shake-float-above-text-field-outlined-dense{0%{-webkit-transform:translateX(calc(0 - 0%)) translateY(-110%) scale(.923);transform:translateX(calc(0 - 0%)) translateY(-110%) scale(.923)}33%{-webkit-animation-timing-function:cubic-bezier(0.5, 0, 0.70173, 0.49582);animation-timing-function:cubic-bezier(0.5, 0, 0.70173, 0.49582);-webkit-transform:translateX(calc(4% - 0%)) translateY(-110%) scale(.923);transform:translateX(calc(4% - 0%)) translateY(-110%) scale(.923)}66%{-webkit-animation-timing-function:cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);animation-timing-function:cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);-webkit-transform:translateX(calc(-4% - 0%)) translateY(-110%) scale(.923);transform:translateX(calc(-4% - 0%)) translateY(-110%) scale(.923)}100%{-webkit-transform:translateX(calc(0 - 0%)) translateY(-110%) scale(.923);transform:translateX(calc(0 - 0%)) translateY(-110%) scale(.923)}}@keyframes mdc-floating-label-shake-float-above-text-field-outlined-dense{0%{-webkit-transform:translateX(calc(0 - 0%)) translateY(-110%) scale(.923);transform:translateX(calc(0 - 0%)) translateY(-110%) scale(.923)}33%{-webkit-animation-timing-function:cubic-bezier(0.5, 0, 0.70173, 0.49582);animation-timing-function:cubic-bezier(0.5, 0, 0.70173, 0.49582);-webkit-transform:translateX(calc(4% - 0%)) translateY(-110%) scale(.923);transform:translateX(calc(4% - 0%)) translateY(-110%) scale(.923)}66%{-webkit-animation-timing-function:cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);animation-timing-function:cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);-webkit-transform:translateX(calc(-4% - 0%)) translateY(-110%) scale(.923);transform:translateX(calc(-4% - 0%)) translateY(-110%) scale(.923)}100%{-webkit-transform:translateX(calc(0 - 0%)) translateY(-110%) scale(.923);transform:translateX(calc(0 - 0%)) translateY(-110%) scale(.923)}}@-webkit-keyframes mdc-floating-label-shake-float-above-text-field-outlined-leading-icon{0%{-webkit-transform:translateX(calc(0 - 32px)) translateY(-130%) scale(.75);transform:translateX(calc(0 - 32px)) translateY(-130%) scale(.75)}33%{-webkit-animation-timing-function:cubic-bezier(0.5, 0, 0.70173, 0.49582);animation-timing-function:cubic-bezier(0.5, 0, 0.70173, 0.49582);-webkit-transform:translateX(calc(4% - 32px)) translateY(-130%) scale(.75);transform:translateX(calc(4% - 32px)) translateY(-130%) scale(.75)}66%{-webkit-animation-timing-function:cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);animation-timing-function:cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);-webkit-transform:translateX(calc(-4% - 32px)) translateY(-130%) scale(.75);transform:translateX(calc(-4% - 32px)) translateY(-130%) scale(.75)}100%{-webkit-transform:translateX(calc(0 - 32px)) translateY(-130%) scale(.75);transform:translateX(calc(0 - 32px)) translateY(-130%) scale(.75)}}@keyframes mdc-floating-label-shake-float-above-text-field-outlined-leading-icon{0%{-webkit-transform:translateX(calc(0 - 32px)) translateY(-130%) scale(.75);transform:translateX(calc(0 - 32px)) translateY(-130%) scale(.75)}33%{-webkit-animation-timing-function:cubic-bezier(0.5, 0, 0.70173, 0.49582);animation-timing-function:cubic-bezier(0.5, 0, 0.70173, 0.49582);-webkit-transform:translateX(calc(4% - 32px)) translateY(-130%) scale(.75);transform:translateX(calc(4% - 32px)) translateY(-130%) scale(.75)}66%{-webkit-animation-timing-function:cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);animation-timing-function:cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);-webkit-transform:translateX(calc(-4% - 32px)) translateY(-130%) scale(.75);transform:translateX(calc(-4% - 32px)) translateY(-130%) scale(.75)}100%{-webkit-transform:translateX(calc(0 - 32px)) translateY(-130%) scale(.75);transform:translateX(calc(0 - 32px)) translateY(-130%) scale(.75)}}@-webkit-keyframes mdc-floating-label-shake-float-above-text-field-outlined-leading-icon-dense{0%{-webkit-transform:translateX(calc(0 - 21px)) translateY(-110%) scale(.923);transform:translateX(calc(0 - 21px)) translateY(-110%) scale(.923)}33%{-webkit-animation-timing-function:cubic-bezier(0.5, 0, 0.70173, 0.49582);animation-timing-function:cubic-bezier(0.5, 0, 0.70173, 0.49582);-webkit-transform:translateX(calc(4% - 21px)) translateY(-110%) scale(.923);transform:translateX(calc(4% - 21px)) translateY(-110%) scale(.923)}66%{-webkit-animation-timing-function:cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);animation-timing-function:cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);-webkit-transform:translateX(calc(-4% - 21px)) translateY(-110%) scale(.923);transform:translateX(calc(-4% - 21px)) translateY(-110%) scale(.923)}100%{-webkit-transform:translateX(calc(0 - 21px)) translateY(-110%) scale(.923);transform:translateX(calc(0 - 21px)) translateY(-110%) scale(.923)}}@keyframes mdc-floating-label-shake-float-above-text-field-outlined-leading-icon-dense{0%{-webkit-transform:translateX(calc(0 - 21px)) translateY(-110%) scale(.923);transform:translateX(calc(0 - 21px)) translateY(-110%) scale(.923)}33%{-webkit-animation-timing-function:cubic-bezier(0.5, 0, 0.70173, 0.49582);animation-timing-function:cubic-bezier(0.5, 0, 0.70173, 0.49582);-webkit-transform:translateX(calc(4% - 21px)) translateY(-110%) scale(.923);transform:translateX(calc(4% - 21px)) translateY(-110%) scale(.923)}66%{-webkit-animation-timing-function:cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);animation-timing-function:cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);-webkit-transform:translateX(calc(-4% - 21px)) translateY(-110%) scale(.923);transform:translateX(calc(-4% - 21px)) translateY(-110%) scale(.923)}100%{-webkit-transform:translateX(calc(0 - 21px)) translateY(-110%) scale(.923);transform:translateX(calc(0 - 21px)) translateY(-110%) scale(.923)}}@-webkit-keyframes mdc-floating-label-shake-float-above-text-field-outlined-leading-icon-rtl{0%{-webkit-transform:translateX(calc(0 - -32px)) translateY(-130%) scale(.75);transform:translateX(calc(0 - -32px)) translateY(-130%) scale(.75)}33%{-webkit-animation-timing-function:cubic-bezier(0.5, 0, 0.70173, 0.49582);animation-timing-function:cubic-bezier(0.5, 0, 0.70173, 0.49582);-webkit-transform:translateX(calc(4% - -32px)) translateY(-130%) scale(.75);transform:translateX(calc(4% - -32px)) translateY(-130%) scale(.75)}66%{-webkit-animation-timing-function:cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);animation-timing-function:cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);-webkit-transform:translateX(calc(-4% - -32px)) translateY(-130%) scale(.75);transform:translateX(calc(-4% - -32px)) translateY(-130%) scale(.75)}100%{-webkit-transform:translateX(calc(0 - -32px)) translateY(-130%) scale(.75);transform:translateX(calc(0 - -32px)) translateY(-130%) scale(.75)}}@keyframes mdc-floating-label-shake-float-above-text-field-outlined-leading-icon-rtl{0%{-webkit-transform:translateX(calc(0 - -32px)) translateY(-130%) scale(.75);transform:translateX(calc(0 - -32px)) translateY(-130%) scale(.75)}33%{-webkit-animation-timing-function:cubic-bezier(0.5, 0, 0.70173, 0.49582);animation-timing-function:cubic-bezier(0.5, 0, 0.70173, 0.49582);-webkit-transform:translateX(calc(4% - -32px)) translateY(-130%) scale(.75);transform:translateX(calc(4% - -32px)) translateY(-130%) scale(.75)}66%{-webkit-animation-timing-function:cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);animation-timing-function:cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);-webkit-transform:translateX(calc(-4% - -32px)) translateY(-130%) scale(.75);transform:translateX(calc(-4% - -32px)) translateY(-130%) scale(.75)}100%{-webkit-transform:translateX(calc(0 - -32px)) translateY(-130%) scale(.75);transform:translateX(calc(0 - -32px)) translateY(-130%) scale(.75)}}@-webkit-keyframes mdc-floating-label-shake-float-above-text-field-outlined-leading-icon-dense-rtl{0%{-webkit-transform:translateX(calc(0 - -21px)) translateY(-110%) scale(.923);transform:translateX(calc(0 - -21px)) translateY(-110%) scale(.923)}33%{-webkit-animation-timing-function:cubic-bezier(0.5, 0, 0.70173, 0.49582);animation-timing-function:cubic-bezier(0.5, 0, 0.70173, 0.49582);-webkit-transform:translateX(calc(4% - -21px)) translateY(-110%) scale(.923);transform:translateX(calc(4% - -21px)) translateY(-110%) scale(.923)}66%{-webkit-animation-timing-function:cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);animation-timing-function:cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);-webkit-transform:translateX(calc(-4% - -21px)) translateY(-110%) scale(.923);transform:translateX(calc(-4% - -21px)) translateY(-110%) scale(.923)}100%{-webkit-transform:translateX(calc(0 - -21px)) translateY(-110%) scale(.923);transform:translateX(calc(0 - -21px)) translateY(-110%) scale(.923)}}@keyframes mdc-floating-label-shake-float-above-text-field-outlined-leading-icon-dense-rtl{0%{-webkit-transform:translateX(calc(0 - -21px)) translateY(-110%) scale(.923);transform:translateX(calc(0 - -21px)) translateY(-110%) scale(.923)}33%{-webkit-animation-timing-function:cubic-bezier(0.5, 0, 0.70173, 0.49582);animation-timing-function:cubic-bezier(0.5, 0, 0.70173, 0.49582);-webkit-transform:translateX(calc(4% - -21px)) translateY(-110%) scale(.923);transform:translateX(calc(4% - -21px)) translateY(-110%) scale(.923)}66%{-webkit-animation-timing-function:cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);animation-timing-function:cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);-webkit-transform:translateX(calc(-4% - -21px)) translateY(-110%) scale(.923);transform:translateX(calc(-4% - -21px)) translateY(-110%) scale(.923)}100%{-webkit-transform:translateX(calc(0 - -21px)) translateY(-110%) scale(.923);transform:translateX(calc(0 - -21px)) translateY(-110%) scale(.923)}}@-webkit-keyframes mdc-floating-label-shake-float-above-textarea{0%{-webkit-transform:translateX(calc(0 - 0%)) translateY(-50%) scale(.923);transform:translateX(calc(0 - 0%)) translateY(-50%) scale(.923)}33%{-webkit-animation-timing-function:cubic-bezier(0.5, 0, 0.70173, 0.49582);animation-timing-function:cubic-bezier(0.5, 0, 0.70173, 0.49582);-webkit-transform:translateX(calc(4% - 0%)) translateY(-50%) scale(.923);transform:translateX(calc(4% - 0%)) translateY(-50%) scale(.923)}66%{-webkit-animation-timing-function:cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);animation-timing-function:cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);-webkit-transform:translateX(calc(-4% - 0%)) translateY(-50%) scale(.923);transform:translateX(calc(-4% - 0%)) translateY(-50%) scale(.923)}100%{-webkit-transform:translateX(calc(0 - 0%)) translateY(-50%) scale(.923);transform:translateX(calc(0 - 0%)) translateY(-50%) scale(.923)}}@keyframes mdc-floating-label-shake-float-above-textarea{0%{-webkit-transform:translateX(calc(0 - 0%)) translateY(-50%) scale(.923);transform:translateX(calc(0 - 0%)) translateY(-50%) scale(.923)}33%{-webkit-animation-timing-function:cubic-bezier(0.5, 0, 0.70173, 0.49582);animation-timing-function:cubic-bezier(0.5, 0, 0.70173, 0.49582);-webkit-transform:translateX(calc(4% - 0%)) translateY(-50%) scale(.923);transform:translateX(calc(4% - 0%)) translateY(-50%) scale(.923)}66%{-webkit-animation-timing-function:cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);animation-timing-function:cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);-webkit-transform:translateX(calc(-4% - 0%)) translateY(-50%) scale(.923);transform:translateX(calc(-4% - 0%)) translateY(-50%) scale(.923)}100%{-webkit-transform:translateX(calc(0 - 0%)) translateY(-50%) scale(.923);transform:translateX(calc(0 - 0%)) translateY(-50%) scale(.923)}}
+
+/*# sourceMappingURL=mdc.textfield.min.css.map*/
\ No newline at end of file
diff --git a/node_modules/@material/textfield/dist/mdc.textfield.min.js b/node_modules/@material/textfield/dist/mdc.textfield.min.js
new file mode 100644
index 0000000..c24cd20
--- /dev/null
+++ b/node_modules/@material/textfield/dist/mdc.textfield.min.js
@@ -0,0 +1,135 @@
+/*!
+ Material Components for the Web
+ Copyright (c) 2018 Google Inc.
+ License: Apache-2.0
+*/
+!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define([],e):"object"==typeof exports?exports.textfield=e():(t.mdc=t.mdc||{},t.mdc.textfield=e())}(this,function(){return function(t){function e(i){if(n[i])return n[i].exports;var r=n[i]={i:i,l:!1,exports:{}};return t[i].call(r.exports,r,r.exports,e),r.l=!0,r.exports}var n={};return e.m=t,e.c=n,e.d=function(t,n,i){e.o(t,n)||Object.defineProperty(t,n,{configurable:!1,enumerable:!0,get:i})},e.n=function(t){var n=t&&t.__esModule?function(){return t.default}:function(){return t};return e.d(n,"a",n),n},e.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},e.p="",e(e.s=141)}({0:function(t,e,n){"use strict";function i(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}var r=function(){function t(t,e){for(var n=0;n<e.length;n++){var i=e[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}return function(e,n,i){return n&&t(e.prototype,n),i&&t(e,i),e}}(),a=function(){function t(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};i(this,t),this.adapter_=e}return r(t,null,[{key:"cssClasses",get:function(){return{}}},{key:"strings",get:function(){return{}}},{key:"numbers",get:function(){return{}}},{key:"defaultAdapter",get:function(){return{}}}]),r(t,[{key:"init",value:function(){}},{key:"destroy",value:function(){}}]),t}();e.a=a},1:function(t,e,n){"use strict";function i(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}var r=n(0),a=function(){function t(t,e){for(var n=0;n<e.length;n++){var i=e[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}return function(e,n,i){return n&&t(e.prototype,n),i&&t(e,i),e}}(),o=function(){function t(e){var n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:void 0;i(this,t),this.root_=e;for(var r=arguments.length,a=Array(r>2?r-2:0),o=2;o<r;o++)a[o-2]=arguments[o];this.initialize.apply(this,a),this.foundation_=void 0===n?this.getDefaultFoundation():n,this.foundation_.init(),this.initialSyncWithDOM()}return a(t,null,[{key:"attachTo",value:function(e){return new t(e,new r.a)}}]),a(t,[{key:"initialize",value:function(){}},{key:"getDefaultFoundation",value:function(){throw new Error("Subclasses must override getDefaultFoundation to return a properly configured foundation class")}},{key:"initialSyncWithDOM",value:function(){}},{key:"destroy",value:function(){this.foundation_.destroy()}},{key:"listen",value:function(t,e){this.root_.addEventListener(t,e)}},{key:"unlisten",value:function(t,e){this.root_.removeEventListener(t,e)}},{key:"emit",value:function(t,e){var n=arguments.length>2&&void 0!==arguments[2]&&arguments[2],i=void 0;"function"==typeof CustomEvent?i=new CustomEvent(t,{detail:e,bubbles:n}):(i=document.createEvent("CustomEvent"),i.initCustomEvent(t,n,!1,e)),this.root_.dispatchEvent(i)}}]),t}();e.a=o},13:function(t,e,n){"use strict";function i(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}var r=function(){function t(t,e){for(var n=0;n<e.length;n++){var i=e[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}return function(e,n,i){return n&&t(e.prototype,n),i&&t(e,i),e}}();!function(){function t(){i(this,t)}r(t,[{key:"addClass",value:function(t){}},{key:"removeClass",value:function(t){}},{key:"getWidth",value:function(){}},{key:"registerInteractionHandler",value:function(t,e){}},{key:"deregisterInteractionHandler",value:function(t,e){}}])}()},14:function(t,e,n){"use strict";function i(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}var r=function(){function t(t,e){for(var n=0;n<e.length;n++){var i=e[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}return function(e,n,i){return n&&t(e.prototype,n),i&&t(e,i),e}}();!function(){function t(){i(this,t)}r(t,[{key:"addClass",value:function(t){}},{key:"removeClass",value:function(t){}},{key:"hasClass",value:function(t){}},{key:"setStyle",value:function(t,e){}},{key:"registerEventHandler",value:function(t,e){}},{key:"deregisterEventHandler",value:function(t,e){}}])}()},141:function(t,e,n){"use strict";function i(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function r(t,e){if(!t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!e||"object"!=typeof e&&"function"!=typeof e?t:e}function a(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),e&&(Object.setPrototypeOf?Object.setPrototypeOf(t,e):t.__proto__=e)}Object.defineProperty(e,"__esModule",{value:!0}),n.d(e,"MDCTextField",function(){return g});var o=n(1),u=n(4),s=n(2),c=n(64),l=(n(65),n(144)),f=n(22),d=n(145),p=n(146),h=n(19),v=n(25);n.d(e,"MDCTextFieldFoundation",function(){return l.a}),n.d(e,"MDCTextFieldHelperText",function(){return d.a}),n.d(e,"MDCTextFieldHelperTextFoundation",function(){return d.b}),n.d(e,"MDCTextFieldIcon",function(){return p.a}),n.d(e,"MDCTextFieldIconFoundation",function(){return p.b});var _=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&(t[i]=n[i])}return t},y=function(){function t(t,e){for(var n=0;n<e.length;n++){var i=e[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}return function(e,n,i){return n&&t(e.prototype,n),i&&t(e,i),e}}(),b=function t(e,n,i){null===e&&(e=Function.prototype);var r=Object.getOwnPropertyDescriptor(e,n);if(void 0===r){var a=Object.getPrototypeOf(e);return null===a?void 0:t(a,n,i)}if("value"in r)return r.value;var o=r.get;if(void 0!==o)return o.call(i)},g=function(t){function e(){var t;i(this,e);for(var n=arguments.length,a=Array(n),o=0;o<n;o++)a[o]=arguments[o];var u=r(this,(t=e.__proto__||Object.getPrototypeOf(e)).call.apply(t,[this].concat(a)));return u.input_,u.ripple,u.lineRipple_,u.helperText_,u.icon_,u.label_,u.outline_,u}return a(e,t),y(e,[{key:"initialize",value:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:function(t,e){return new u.MDCRipple(t,e)},e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:function(t){return new f.MDCLineRipple(t)},n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:function(t){return new d.a(t)},i=arguments.length>3&&void 0!==arguments[3]?arguments[3]:function(t){return new p.a(t)},r=this,a=arguments.length>4&&void 0!==arguments[4]?arguments[4]:function(t){return new h.MDCFloatingLabel(t)},o=arguments.length>5&&void 0!==arguments[5]?arguments[5]:function(t){return new v.MDCNotchedOutline(t)};this.input_=this.root_.querySelector(c.d.INPUT_SELECTOR);var l=this.root_.querySelector(c.d.LABEL_SELECTOR);l&&(this.label_=a(l));var y=this.root_.querySelector(c.d.LINE_RIPPLE_SELECTOR);y&&(this.lineRipple_=e(y));var b=this.root_.querySelector(c.d.OUTLINE_SELECTOR);if(b&&(this.outline_=o(b)),this.input_.hasAttribute(c.d.ARIA_CONTROLS)){var g=document.getElementById(this.input_.getAttribute(c.d.ARIA_CONTROLS));g&&(this.helperText_=n(g))}var m=this.root_.querySelector(c.d.ICON_SELECTOR);if(m&&(this.icon_=i(m)),this.ripple=null,this.root_.classList.contains(c.b.BOX)){var E=Object(s.getMatchesProperty)(HTMLElement.prototype),O=_(u.MDCRipple.createAdapter(this),{isSurfaceActive:function(){return r.input_[E](":active")},registerInteractionHandler:function(t,e){return r.input_.addEventListener(t,e)},deregisterInteractionHandler:function(t,e){return r.input_.removeEventListener(t,e)}}),C=new u.MDCRippleFoundation(O);this.ripple=t(this.root_,C)}}},{key:"destroy",value:function(){this.ripple&&this.ripple.destroy(),this.lineRipple_&&this.lineRipple_.destroy(),this.helperText_&&this.helperText_.destroy(),this.icon_&&this.icon_.destroy(),this.label_&&this.label_.destroy(),this.outline_&&this.outline_.destroy(),b(e.prototype.__proto__||Object.getPrototypeOf(e.prototype),"destroy",this).call(this)}},{key:"initialSyncWithDom",value:function(){this.disabled=this.input_.disabled}},{key:"layout",value:function(){var t=this.foundation_.shouldFloat;this.foundation_.notchOutline(t)}},{key:"getDefaultFoundation",value:function(){var t=this;return new l.a(_({addClass:function(e){return t.root_.classList.add(e)},removeClass:function(e){return t.root_.classList.remove(e)},hasClass:function(e){return t.root_.classList.contains(e)},registerTextFieldInteractionHandler:function(e,n){return t.root_.addEventListener(e,n)},deregisterTextFieldInteractionHandler:function(e,n){return t.root_.removeEventListener(e,n)},registerValidationAttributeChangeHandler:function(e){var n=function(t){return t.map(function(t){return t.attributeName})},i=new MutationObserver(function(t){return e(n(t))}),r=t.root_.querySelector(c.d.INPUT_SELECTOR),a={attributes:!0};return i.observe(r,a),i},deregisterValidationAttributeChangeHandler:function(t){return t.disconnect()},isFocused:function(){return document.activeElement===t.root_.querySelector(c.d.INPUT_SELECTOR)},isRtl:function(){return"rtl"===window.getComputedStyle(t.root_).getPropertyValue("direction")}},this.getInputAdapterMethods_(),this.getLabelAdapterMethods_(),this.getLineRippleAdapterMethods_(),this.getOutlineAdapterMethods_()),this.getFoundationMap_())}},{key:"getLabelAdapterMethods_",value:function(){var t=this;return{shakeLabel:function(e){return t.label_.shake(e)},floatLabel:function(e){return t.label_.float(e)},hasLabel:function(){return!!t.label_},getLabelWidth:function(){return t.label_.getWidth()}}}},{key:"getLineRippleAdapterMethods_",value:function(){var t=this;return{activateLineRipple:function(){t.lineRipple_&&t.lineRipple_.activate()},deactivateLineRipple:function(){t.lineRipple_&&t.lineRipple_.deactivate()},setLineRippleTransformOrigin:function(e){t.lineRipple_&&t.lineRipple_.setRippleCenter(e)}}}},{key:"getOutlineAdapterMethods_",value:function(){var t=this;return{notchOutline:function(e,n){return t.outline_.notch(e,n)},closeOutline:function(){return t.outline_.closeNotch()},hasOutline:function(){return!!t.outline_}}}},{key:"getInputAdapterMethods_",value:function(){var t=this;return{registerInputInteractionHandler:function(e,n){return t.input_.addEventListener(e,n)},deregisterInputInteractionHandler:function(e,n){return t.input_.removeEventListener(e,n)},getNativeInput:function(){return t.input_}}}},{key:"getFoundationMap_",value:function(){return{helperText:this.helperText_?this.helperText_.foundation:void 0,icon:this.icon_?this.icon_.foundation:void 0}}},{key:"value",get:function(){return this.foundation_.getValue()},set:function(t){this.foundation_.setValue(t)}},{key:"disabled",get:function(){return this.foundation_.isDisabled()},set:function(t){this.foundation_.setDisabled(t)}},{key:"valid",get:function(){return this.foundation_.isValid()},set:function(t){this.foundation_.setValid(t)}},{key:"required",get:function(){return this.input_.required},set:function(t){this.input_.required=t}},{key:"pattern",get:function(){return this.input_.pattern},set:function(t){this.input_.pattern=t}},{key:"minLength",get:function(){return this.input_.minLength},set:function(t){this.input_.minLength=t}},{key:"maxLength",get:function(){return this.input_.maxLength},set:function(t){t<0?this.input_.removeAttribute("maxLength"):this.input_.maxLength=t}},{key:"min",get:function(){return this.input_.min},set:function(t){this.input_.min=t}},{key:"max",get:function(){return this.input_.max},set:function(t){this.input_.max=t}},{key:"step",get:function(){return this.input_.step},set:function(t){this.input_.step=t}},{key:"helperTextContent",set:function(t){this.foundation_.setHelperTextContent(t)}},{key:"iconAriaLabel",set:function(t){this.foundation_.setIconAriaLabel(t)}},{key:"iconContent",set:function(t){this.foundation_.setIconContent(t)}}],[{key:"attachTo",value:function(t){return new e(t)}}]),e}(o.a)},142:function(t,e,n){"use strict";n.d(e,"b",function(){return i}),n.d(e,"a",function(){return r});/**
+ * @license
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+var i={ARIA_HIDDEN:"aria-hidden",ROLE:"role"},r={HELPER_TEXT_PERSISTENT:"mdc-text-field-helper-text--persistent",HELPER_TEXT_VALIDATION_MSG:"mdc-text-field-helper-text--validation-msg"}},143:function(t,e,n){"use strict";n.d(e,"a",function(){return i});/**
+ * @license
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+var i={ICON_EVENT:"MDCTextField:icon",ICON_ROLE:"button"}},144:function(t,e,n){"use strict";function i(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function r(t,e){if(!t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!e||"object"!=typeof e&&"function"!=typeof e?t:e}function a(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),e&&(Object.setPrototypeOf?Object.setPrototypeOf(t,e):t.__proto__=e)}var o=n(0),u=(n(47),n(48),n(65),n(64)),s=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&(t[i]=n[i])}return t},c=function(){function t(t,e){for(var n=0;n<e.length;n++){var i=e[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}return function(e,n,i){return n&&t(e.prototype,n),i&&t(e,i),e}}(),l=function(t){function e(t){var n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};i(this,e);var a=r(this,(e.__proto__||Object.getPrototypeOf(e)).call(this,s(e.defaultAdapter,t)));return a.helperText_=n.helperText,a.icon_=n.icon,a.isFocused_=!1,a.receivedUserInput_=!1,a.useCustomValidityChecking_=!1,a.isValid_=!0,a.inputFocusHandler_=function(){return a.activateFocus()},a.inputBlurHandler_=function(){return a.deactivateFocus()},a.inputInputHandler_=function(){return a.autoCompleteFocus()},a.setPointerXOffset_=function(t){return a.setTransformOrigin(t)},a.textFieldInteractionHandler_=function(){return a.handleTextFieldInteraction()},a.validationAttributeChangeHandler_=function(t){return a.handleValidationAttributeChange(t)},a.validationObserver_,a}return a(e,t),c(e,[{key:"shouldShake",get:function(){return!this.isValid()&&!this.isFocused_}},{key:"shouldFloat",get:function(){return this.isFocused_||!!this.getValue()||this.isBadInput_()}}],[{key:"cssClasses",get:function(){return u.b}},{key:"strings",get:function(){return u.d}},{key:"numbers",get:function(){return u.c}},{key:"defaultAdapter",get:function(){return{addClass:function(){},removeClass:function(){},hasClass:function(){},registerTextFieldInteractionHandler:function(){},deregisterTextFieldInteractionHandler:function(){},registerInputInteractionHandler:function(){},deregisterInputInteractionHandler:function(){},registerValidationAttributeChangeHandler:function(){},deregisterValidationAttributeChangeHandler:function(){},getNativeInput:function(){},isFocused:function(){},isRtl:function(){},activateLineRipple:function(){},deactivateLineRipple:function(){},setLineRippleTransformOrigin:function(){},shakeLabel:function(){},floatLabel:function(){},hasLabel:function(){},getLabelWidth:function(){},hasOutline:function(){},notchOutline:function(){},closeOutline:function(){}}}}]),c(e,[{key:"init",value:function(){var t=this;this.adapter_.addClass(e.cssClasses.UPGRADED),this.adapter_.hasLabel()&&(this.getValue()||this.isBadInput_())&&(this.adapter_.floatLabel(this.shouldFloat),this.notchOutline(this.shouldFloat)),this.adapter_.isFocused()&&this.inputFocusHandler_(),this.adapter_.registerInputInteractionHandler("focus",this.inputFocusHandler_),this.adapter_.registerInputInteractionHandler("blur",this.inputBlurHandler_),this.adapter_.registerInputInteractionHandler("input",this.inputInputHandler_),["mousedown","touchstart"].forEach(function(e){t.adapter_.registerInputInteractionHandler(e,t.setPointerXOffset_)}),["click","keydown"].forEach(function(e){t.adapter_.registerTextFieldInteractionHandler(e,t.textFieldInteractionHandler_)}),this.validationObserver_=this.adapter_.registerValidationAttributeChangeHandler(this.validationAttributeChangeHandler_)}},{key:"destroy",value:function(){var t=this;this.adapter_.removeClass(e.cssClasses.UPGRADED),this.adapter_.deregisterInputInteractionHandler("focus",this.inputFocusHandler_),this.adapter_.deregisterInputInteractionHandler("blur",this.inputBlurHandler_),this.adapter_.deregisterInputInteractionHandler("input",this.inputInputHandler_),["mousedown","touchstart"].forEach(function(e){t.adapter_.deregisterInputInteractionHandler(e,t.setPointerXOffset_)}),["click","keydown"].forEach(function(e){t.adapter_.deregisterTextFieldInteractionHandler(e,t.textFieldInteractionHandler_)}),this.adapter_.deregisterValidationAttributeChangeHandler(this.validationObserver_)}},{key:"handleTextFieldInteraction",value:function(){this.adapter_.getNativeInput().disabled||(this.receivedUserInput_=!0)}},{key:"handleValidationAttributeChange",value:function(t){var e=this;t.some(function(t){if(u.a.indexOf(t)>-1)return e.styleValidity_(!0),!0})}},{key:"notchOutline",value:function(t){if(this.adapter_.hasOutline()&&this.adapter_.hasLabel())if(t){var e=this.adapter_.hasClass(u.b.DENSE),n=e?u.c.DENSE_LABEL_SCALE:u.c.LABEL_SCALE,i=this.adapter_.getLabelWidth()*n,r=this.adapter_.isRtl();this.adapter_.notchOutline(i,r)}else this.adapter_.closeOutline()}},{key:"activateFocus",value:function(){this.isFocused_=!0,this.styleFocused_(this.isFocused_),this.adapter_.activateLineRipple(),this.notchOutline(this.shouldFloat),this.adapter_.hasLabel()&&(this.adapter_.shakeLabel(this.shouldShake),this.adapter_.floatLabel(this.shouldFloat)),this.helperText_&&this.helperText_.showToScreenReader()}},{key:"setTransformOrigin",value:function(t){var e=t.target.getBoundingClientRect(),n={x:t.clientX,y:t.clientY},i=n.x-e.left;this.adapter_.setLineRippleTransformOrigin(i)}},{key:"autoCompleteFocus",value:function(){this.receivedUserInput_||this.activateFocus()}},{key:"deactivateFocus",value:function(){this.isFocused_=!1,this.adapter_.deactivateLineRipple();var t=this.getNativeInput_(),e=!t.value&&!this.isBadInput_(),n=this.isValid();this.styleValidity_(n),this.styleFocused_(this.isFocused_),this.adapter_.hasLabel()&&(this.adapter_.shakeLabel(this.shouldShake),this.adapter_.floatLabel(this.shouldFloat),this.notchOutline(this.shouldFloat)),e&&(this.receivedUserInput_=!1)}},{key:"getValue",value:function(){return this.getNativeInput_().value}},{key:"setValue",value:function(t){this.getNativeInput_().value=t;var e=this.isValid();this.styleValidity_(e),this.adapter_.hasLabel()&&(this.adapter_.shakeLabel(this.shouldShake),this.adapter_.floatLabel(this.shouldFloat),this.notchOutline(this.shouldFloat))}},{key:"isValid",value:function(){return this.useCustomValidityChecking_?this.isValid_:this.isNativeInputValid_()}},{key:"setValid",value:function(t){this.useCustomValidityChecking_=!0,this.isValid_=t,t=this.isValid(),this.styleValidity_(t),this.adapter_.hasLabel()&&this.adapter_.shakeLabel(this.shouldShake)}},{key:"isDisabled",value:function(){return this.getNativeInput_().disabled}},{key:"setDisabled",value:function(t){this.getNativeInput_().disabled=t,this.styleDisabled_(t)}},{key:"setHelperTextContent",value:function(t){this.helperText_&&this.helperText_.setContent(t)}},{key:"setIconAriaLabel",value:function(t){this.icon_&&this.icon_.setAriaLabel(t)}},{key:"setIconContent",value:function(t){this.icon_&&this.icon_.setContent(t)}},{key:"isBadInput_",value:function(){return this.getNativeInput_().validity.badInput}},{key:"isNativeInputValid_",value:function(){return this.getNativeInput_().validity.valid}},{key:"styleValidity_",value:function(t){var n=e.cssClasses.INVALID;t?this.adapter_.removeClass(n):this.adapter_.addClass(n),this.helperText_&&this.helperText_.setValidity(t)}},{key:"styleFocused_",value:function(t){var n=e.cssClasses.FOCUSED;t?this.adapter_.addClass(n):this.adapter_.removeClass(n)}},{key:"styleDisabled_",value:function(t){var n=e.cssClasses,i=n.DISABLED,r=n.INVALID;t?(this.adapter_.addClass(i),this.adapter_.removeClass(r)):this.adapter_.removeClass(i),this.icon_&&this.icon_.setDisabled(t)}},{key:"getNativeInput_",value:function(){return this.adapter_.getNativeInput()||{value:"",disabled:!1,validity:{badInput:!1,valid:!0}}}}]),e}(o.a);e.a=l},145:function(t,e,n){"use strict";function i(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function r(t,e){if(!t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!e||"object"!=typeof e&&"function"!=typeof e?t:e}function a(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),e&&(Object.setPrototypeOf?Object.setPrototypeOf(t,e):t.__proto__=e)}n.d(e,"a",function(){return l});var o=n(1),u=(n(66),n(47));n.d(e,"b",function(){return u.a});var s=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&(t[i]=n[i])}return t},c=function(){function t(t,e){for(var n=0;n<e.length;n++){var i=e[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}return function(e,n,i){return n&&t(e.prototype,n),i&&t(e,i),e}}(),l=function(t){function e(){return i(this,e),r(this,(e.__proto__||Object.getPrototypeOf(e)).apply(this,arguments))}return a(e,t),c(e,[{key:"getDefaultFoundation",value:function(){var t=this;return new u.a(s({addClass:function(e){return t.root_.classList.add(e)},removeClass:function(e){return t.root_.classList.remove(e)},hasClass:function(e){return t.root_.classList.contains(e)},setAttr:function(e,n){return t.root_.setAttribute(e,n)},removeAttr:function(e){return t.root_.removeAttribute(e)},setContent:function(e){t.root_.textContent=e}}))}},{key:"foundation",get:function(){return this.foundation_}}],[{key:"attachTo",value:function(t){return new e(t)}}]),e}(o.a)},146:function(t,e,n){"use strict";function i(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function r(t,e){if(!t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!e||"object"!=typeof e&&"function"!=typeof e?t:e}function a(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),e&&(Object.setPrototypeOf?Object.setPrototypeOf(t,e):t.__proto__=e)}n.d(e,"a",function(){return l});var o=n(1),u=(n(67),n(48));n.d(e,"b",function(){return u.a});var s=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&(t[i]=n[i])}return t},c=function(){function t(t,e){for(var n=0;n<e.length;n++){var i=e[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}return function(e,n,i){return n&&t(e.prototype,n),i&&t(e,i),e}}(),l=function(t){function e(){return i(this,e),r(this,(e.__proto__||Object.getPrototypeOf(e)).apply(this,arguments))}return a(e,t),c(e,[{key:"getDefaultFoundation",value:function(){var t=this;return new u.a(s({getAttr:function(e){return t.root_.getAttribute(e)},setAttr:function(e,n){return t.root_.setAttribute(e,n)},removeAttr:function(e){return t.root_.removeAttribute(e)},setContent:function(e){t.root_.textContent=e},registerInteractionHandler:function(e,n){return t.root_.addEventListener(e,n)},deregisterInteractionHandler:function(e,n){return t.root_.removeEventListener(e,n)},notifyIconAction:function(){return t.emit(u.a.strings.ICON_EVENT,{},!0)}}))}},{key:"foundation",get:function(){return this.foundation_}}],[{key:"attachTo",value:function(t){return new e(t)}}]),e}(o.a)},15:function(t,e,n){"use strict";function i(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}var r=function(){function t(t,e){for(var n=0;n<e.length;n++){var i=e[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}return function(e,n,i){return n&&t(e.prototype,n),i&&t(e,i),e}}();!function(){function t(){i(this,t)}r(t,[{key:"getWidth",value:function(){}},{key:"getHeight",value:function(){}},{key:"addClass",value:function(t){}},{key:"removeClass",value:function(t){}},{key:"setOutlinePathAttr",value:function(t){}},{key:"getIdleOutlineStyleValue",value:function(t){}}])}()},16:function(t,e,n){"use strict";n.d(e,"a",function(){return r}),n.d(e,"b",function(){return i});/**
+ * @license
+ * Copyright 2018 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+var i={PATH_SELECTOR:".mdc-notched-outline__path",IDLE_OUTLINE_SELECTOR:".mdc-notched-outline__idle"},r={OUTLINE_NOTCHED:"mdc-notched-outline--notched"}},19:function(t,e,n){"use strict";function i(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function r(t,e){if(!t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!e||"object"!=typeof e&&"function"!=typeof e?t:e}function a(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),e&&(Object.setPrototypeOf?Object.setPrototypeOf(t,e):t.__proto__=e)}Object.defineProperty(e,"__esModule",{value:!0}),n.d(e,"MDCFloatingLabel",function(){return c});var o=n(1),u=(n(13),n(20));n.d(e,"MDCFloatingLabelFoundation",function(){return u.a});var s=function(){function t(t,e){for(var n=0;n<e.length;n++){var i=e[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}return function(e,n,i){return n&&t(e.prototype,n),i&&t(e,i),e}}(),c=function(t){function e(){return i(this,e),r(this,(e.__proto__||Object.getPrototypeOf(e)).apply(this,arguments))}return a(e,t),s(e,[{key:"shake",value:function(t){this.foundation_.shake(t)}},{key:"float",value:function(t){this.foundation_.float(t)}},{key:"getWidth",value:function(){return this.foundation_.getWidth()}},{key:"getDefaultFoundation",value:function(){var t=this;return new u.a({addClass:function(e){return t.root_.classList.add(e)},removeClass:function(e){return t.root_.classList.remove(e)},getWidth:function(){return t.root_.offsetWidth},registerInteractionHandler:function(e,n){return t.root_.addEventListener(e,n)},deregisterInteractionHandler:function(e,n){return t.root_.removeEventListener(e,n)}})}}],[{key:"attachTo",value:function(t){return new e(t)}}]),e}(o.a)},2:function(t,e,n){"use strict";function i(t){var e=t.document,n=e.createElement("div");n.className="mdc-ripple-surface--test-edge-var-bug",e.body.appendChild(n);var i=t.getComputedStyle(n),r=null!==i&&"solid"===i.borderTopStyle;return n.remove(),r}function r(t){var e=arguments.length>1&&void 0!==arguments[1]&&arguments[1],n=s;if("boolean"==typeof s&&!e)return n;if(t.CSS&&"function"==typeof t.CSS.supports){var r=t.CSS.supports("--css-vars","yes"),a=t.CSS.supports("(--css-vars: yes)")&&t.CSS.supports("color","#00000000");return n=!(!r&&!a||i(t)),e||(s=n),n}}function a(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:window,e=arguments.length>1&&void 0!==arguments[1]&&arguments[1];if(void 0===c||e){var n=!1;try{t.document.addEventListener("test",null,{get passive(){n=!0}})}catch(t){}c=n}return!!c&&{passive:!0}}function o(t){return["webkitMatchesSelector","msMatchesSelector","matches"].filter(function(e){return e in t}).pop()}function u(t,e,n){var i=e.x,r=e.y,a=i+n.left,o=r+n.top,u=void 0,s=void 0;return"touchstart"===t.type?(u=t.changedTouches[0].pageX-a,s=t.changedTouches[0].pageY-o):(u=t.pageX-a,s=t.pageY-o),{x:u,y:s}}Object.defineProperty(e,"__esModule",{value:!0}),n.d(e,"supportsCssVariables",function(){return r}),n.d(e,"applyPassive",function(){return a}),n.d(e,"getMatchesProperty",function(){return o}),n.d(e,"getNormalizedEventCoords",function(){return u});/**
+ * @license
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+var s=void 0,c=void 0},20:function(t,e,n){"use strict";function i(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function r(t,e){if(!t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!e||"object"!=typeof e&&"function"!=typeof e?t:e}function a(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),e&&(Object.setPrototypeOf?Object.setPrototypeOf(t,e):t.__proto__=e)}var o=n(0),u=(n(13),n(21)),s=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&(t[i]=n[i])}return t},c=function(){function t(t,e){for(var n=0;n<e.length;n++){var i=e[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}return function(e,n,i){return n&&t(e.prototype,n),i&&t(e,i),e}}(),l=function(t){function e(t){i(this,e);var n=r(this,(e.__proto__||Object.getPrototypeOf(e)).call(this,s(e.defaultAdapter,t)));return n.shakeAnimationEndHandler_=function(){return n.handleShakeAnimationEnd_()},n}return a(e,t),c(e,null,[{key:"cssClasses",get:function(){return u.a}},{key:"defaultAdapter",get:function(){return{addClass:function(){},removeClass:function(){},getWidth:function(){},registerInteractionHandler:function(){},deregisterInteractionHandler:function(){}}}}]),c(e,[{key:"init",value:function(){this.adapter_.registerInteractionHandler("animationend",this.shakeAnimationEndHandler_)}},{key:"destroy",value:function(){this.adapter_.deregisterInteractionHandler("animationend",this.shakeAnimationEndHandler_)}},{key:"getWidth",value:function(){return this.adapter_.getWidth()}},{key:"shake",value:function(t){var n=e.cssClasses.LABEL_SHAKE;t?this.adapter_.addClass(n):this.adapter_.removeClass(n)}},{key:"float",value:function(t){var n=e.cssClasses,i=n.LABEL_FLOAT_ABOVE,r=n.LABEL_SHAKE;t?this.adapter_.addClass(i):(this.adapter_.removeClass(i),this.adapter_.removeClass(r))}},{key:"handleShakeAnimationEnd_",value:function(){var t=e.cssClasses.LABEL_SHAKE;this.adapter_.removeClass(t)}}]),e}(o.a);e.a=l},21:function(t,e,n){"use strict";n.d(e,"a",function(){return i});/**
+ * @license
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+var i={LABEL_FLOAT_ABOVE:"mdc-floating-label--float-above",LABEL_SHAKE:"mdc-floating-label--shake"}},22:function(t,e,n){"use strict";function i(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function r(t,e){if(!t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!e||"object"!=typeof e&&"function"!=typeof e?t:e}function a(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),e&&(Object.setPrototypeOf?Object.setPrototypeOf(t,e):t.__proto__=e)}Object.defineProperty(e,"__esModule",{value:!0}),n.d(e,"MDCLineRipple",function(){return l});var o=n(1),u=(n(14),n(23));n.d(e,"MDCLineRippleFoundation",function(){return u.a});var s=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&(t[i]=n[i])}return t},c=function(){function t(t,e){for(var n=0;n<e.length;n++){var i=e[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}return function(e,n,i){return n&&t(e.prototype,n),i&&t(e,i),e}}(),l=function(t){function e(){return i(this,e),r(this,(e.__proto__||Object.getPrototypeOf(e)).apply(this,arguments))}return a(e,t),c(e,[{key:"activate",value:function(){this.foundation_.activate()}},{key:"deactivate",value:function(){this.foundation_.deactivate()}},{key:"setRippleCenter",value:function(t){this.foundation_.setRippleCenter(t)}},{key:"getDefaultFoundation",value:function(){var t=this;return new u.a(s({addClass:function(e){return t.root_.classList.add(e)},removeClass:function(e){return t.root_.classList.remove(e)},hasClass:function(e){return t.root_.classList.contains(e)},setStyle:function(e,n){return t.root_.style[e]=n},registerEventHandler:function(e,n){return t.root_.addEventListener(e,n)},deregisterEventHandler:function(e,n){return t.root_.removeEventListener(e,n)}}))}}],[{key:"attachTo",value:function(t){return new e(t)}}]),e}(o.a)},23:function(t,e,n){"use strict";function i(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function r(t,e){if(!t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!e||"object"!=typeof e&&"function"!=typeof e?t:e}function a(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),e&&(Object.setPrototypeOf?Object.setPrototypeOf(t,e):t.__proto__=e)}var o=n(0),u=(n(14),n(24)),s=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&(t[i]=n[i])}return t},c=function(){function t(t,e){for(var n=0;n<e.length;n++){var i=e[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}return function(e,n,i){return n&&t(e.prototype,n),i&&t(e,i),e}}(),l=function(t){function e(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};i(this,e);var n=r(this,(e.__proto__||Object.getPrototypeOf(e)).call(this,s(e.defaultAdapter,t)));return n.transitionEndHandler_=function(t){return n.handleTransitionEnd(t)},n}return a(e,t),c(e,null,[{key:"cssClasses",get:function(){return u.a}},{key:"defaultAdapter",get:function(){return{addClass:function(){},removeClass:function(){},hasClass:function(){},setStyle:function(){},registerEventHandler:function(){},deregisterEventHandler:function(){}}}}]),c(e,[{key:"init",value:function(){this.adapter_.registerEventHandler("transitionend",this.transitionEndHandler_)}},{key:"destroy",value:function(){this.adapter_.deregisterEventHandler("transitionend",this.transitionEndHandler_)}},{key:"activate",value:function(){this.adapter_.removeClass(u.a.LINE_RIPPLE_DEACTIVATING),this.adapter_.addClass(u.a.LINE_RIPPLE_ACTIVE)}},{key:"setRippleCenter",value:function(t){this.adapter_.setStyle("transform-origin",t+"px center")}},{key:"deactivate",value:function(){this.adapter_.addClass(u.a.LINE_RIPPLE_DEACTIVATING)}},{key:"handleTransitionEnd",value:function(t){var e=this.adapter_.hasClass(u.a.LINE_RIPPLE_DEACTIVATING);"opacity"===t.propertyName&&e&&(this.adapter_.removeClass(u.a.LINE_RIPPLE_ACTIVE),this.adapter_.removeClass(u.a.LINE_RIPPLE_DEACTIVATING))}}]),e}(o.a);e.a=l},24:function(t,e,n){"use strict";n.d(e,"a",function(){return i});/**
+ * @license
+ * Copyright 2018 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+var i={LINE_RIPPLE_ACTIVE:"mdc-line-ripple--active",LINE_RIPPLE_DEACTIVATING:"mdc-line-ripple--deactivating"}},25:function(t,e,n){"use strict";function i(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function r(t,e){if(!t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!e||"object"!=typeof e&&"function"!=typeof e?t:e}function a(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),e&&(Object.setPrototypeOf?Object.setPrototypeOf(t,e):t.__proto__=e)}Object.defineProperty(e,"__esModule",{value:!0}),n.d(e,"MDCNotchedOutline",function(){return l});var o=n(1),u=(n(15),n(26)),s=n(16);n.d(e,"MDCNotchedOutlineFoundation",function(){return u.a});var c=function(){function t(t,e){for(var n=0;n<e.length;n++){var i=e[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}return function(e,n,i){return n&&t(e.prototype,n),i&&t(e,i),e}}(),l=function(t){function e(){return i(this,e),r(this,(e.__proto__||Object.getPrototypeOf(e)).apply(this,arguments))}return a(e,t),c(e,[{key:"notch",value:function(t,e){this.foundation_.notch(t,e)}},{key:"closeNotch",value:function(){this.foundation_.closeNotch()}},{key:"getDefaultFoundation",value:function(){var t=this;return new u.a({getWidth:function(){return t.root_.offsetWidth},getHeight:function(){return t.root_.offsetHeight},addClass:function(e){return t.root_.classList.add(e)},removeClass:function(e){return t.root_.classList.remove(e)},setOutlinePathAttr:function(e){t.root_.querySelector(s.b.PATH_SELECTOR).setAttribute("d",e)},getIdleOutlineStyleValue:function(e){var n=t.root_.parentNode.querySelector(s.b.IDLE_OUTLINE_SELECTOR);return window.getComputedStyle(n).getPropertyValue(e)}})}}],[{key:"attachTo",value:function(t){return new e(t)}}]),e}(o.a)},26:function(t,e,n){"use strict";function i(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function r(t,e){if(!t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!e||"object"!=typeof e&&"function"!=typeof e?t:e}function a(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),e&&(Object.setPrototypeOf?Object.setPrototypeOf(t,e):t.__proto__=e)}var o=n(0),u=(n(15),n(16)),s=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&(t[i]=n[i])}return t},c=function(){function t(t,e){for(var n=0;n<e.length;n++){var i=e[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}return function(e,n,i){return n&&t(e.prototype,n),i&&t(e,i),e}}(),l=function(t){function e(t){return i(this,e),r(this,(e.__proto__||Object.getPrototypeOf(e)).call(this,s(e.defaultAdapter,t)))}return a(e,t),c(e,null,[{key:"strings",get:function(){return u.b}},{key:"cssClasses",get:function(){return u.a}},{key:"defaultAdapter",get:function(){return{getWidth:function(){},getHeight:function(){},addClass:function(){},removeClass:function(){},setOutlinePathAttr:function(){},getIdleOutlineStyleValue:function(){}}}}]),c(e,[{key:"notch",value:function(t){var n=arguments.length>1&&void 0!==arguments[1]&&arguments[1],i=e.cssClasses.OUTLINE_NOTCHED;this.adapter_.addClass(i),this.updateSvgPath_(t,n)}},{key:"closeNotch",value:function(){var t=e.cssClasses.OUTLINE_NOTCHED;this.adapter_.removeClass(t)}},{key:"updateSvgPath_",value:function(t,e){var n=this.adapter_.getIdleOutlineStyleValue("border-radius")||this.adapter_.getIdleOutlineStyleValue("border-top-left-radius"),i=parseFloat(n),r=this.adapter_.getWidth(),a=this.adapter_.getHeight(),o=i+1.2,u=Math.abs(11-o),s=t+8,c="a"+i+","+i+" 0 0 1 "+i+","+i+"v"+(a-2*o)+"a"+i+","+i+" 0 0 1 "+-i+","+i+"h"+(2*o-r)+"a"+i+","+i+" 0 0 1 "+-i+","+-i+"v"+(2*o-a)+"a"+i+","+i+" 0 0 1 "+i+","+-i,l=void 0;l=e?"M"+(r-o-u)+",1h"+u+c+"h"+(r-2*o-s-u):"M"+(o+u+s)+",1h"+(r-2*o-s-u)+c+"h"+u,this.adapter_.setOutlinePathAttr(l)}}]),e}(o.a);e.a=l},3:function(t,e,n){"use strict";function i(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}var r=function(){function t(t,e){for(var n=0;n<e.length;n++){var i=e[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}return function(e,n,i){return n&&t(e.prototype,n),i&&t(e,i),e}}();!function(){function t(){i(this,t)}r(t,[{key:"browserSupportsCssVars",value:function(){}},{key:"isUnbounded",value:function(){}},{key:"isSurfaceActive",value:function(){}},{key:"isSurfaceDisabled",value:function(){}},{key:"addClass",value:function(t){}},{key:"removeClass",value:function(t){}},{key:"containsEventTarget",value:function(t){}},{key:"registerInteractionHandler",value:function(t,e){}},{key:"deregisterInteractionHandler",value:function(t,e){}},{key:"registerDocumentInteractionHandler",value:function(t,e){}},{key:"deregisterDocumentInteractionHandler",value:function(t,e){}},{key:"registerResizeHandler",value:function(t){}},{key:"deregisterResizeHandler",value:function(t){}},{key:"updateCssVariable",value:function(t,e){}},{key:"computeBoundingRect",value:function(){}},{key:"getWindowPageOffset",value:function(){}}])}()},4:function(t,e,n){"use strict";function i(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function r(t,e){if(!t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!e||"object"!=typeof e&&"function"!=typeof e?t:e}function a(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),e&&(Object.setPrototypeOf?Object.setPrototypeOf(t,e):t.__proto__=e)}Object.defineProperty(e,"__esModule",{value:!0}),n.d(e,"MDCRipple",function(){return l}),n.d(e,"RippleCapableSurface",function(){return f});var o=n(1),u=(n(3),n(5)),s=n(2);n.d(e,"MDCRippleFoundation",function(){return u.a}),n.d(e,"util",function(){return s});var c=function(){function t(t,e){for(var n=0;n<e.length;n++){var i=e[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}return function(e,n,i){return n&&t(e.prototype,n),i&&t(e,i),e}}(),l=function(t){function e(){var t;i(this,e);for(var n=arguments.length,a=Array(n),o=0;o<n;o++)a[o]=arguments[o];var u=r(this,(t=e.__proto__||Object.getPrototypeOf(e)).call.apply(t,[this].concat(a)));return u.disabled=!1,u.unbounded_,u}return a(e,t),c(e,[{key:"setUnbounded_",value:function(){this.foundation_.setUnbounded(this.unbounded_)}},{key:"activate",value:function(){this.foundation_.activate()}},{key:"deactivate",value:function(){this.foundation_.deactivate()}},{key:"layout",value:function(){this.foundation_.layout()}},{key:"getDefaultFoundation",value:function(){return new u.a(e.createAdapter(this))}},{key:"initialSyncWithDOM",value:function(){this.unbounded="mdcRippleIsUnbounded"in this.root_.dataset}},{key:"unbounded",get:function(){return this.unbounded_},set:function(t){this.unbounded_=Boolean(t),this.setUnbounded_()}}],[{key:"attachTo",value:function(t){var n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},i=n.isUnbounded,r=void 0===i?void 0:i,a=new e(t);return void 0!==r&&(a.unbounded=r),a}},{key:"createAdapter",value:function(t){var e=s.getMatchesProperty(HTMLElement.prototype);return{browserSupportsCssVars:function(){return s.supportsCssVariables(window)},isUnbounded:function(){return t.unbounded},isSurfaceActive:function(){return t.root_[e](":active")},isSurfaceDisabled:function(){return t.disabled},addClass:function(e){return t.root_.classList.add(e)},removeClass:function(e){return t.root_.classList.remove(e)},containsEventTarget:function(e){return t.root_.contains(e)},registerInteractionHandler:function(e,n){return t.root_.addEventListener(e,n,s.applyPassive())},deregisterInteractionHandler:function(e,n){return t.root_.removeEventListener(e,n,s.applyPassive())},registerDocumentInteractionHandler:function(t,e){return document.documentElement.addEventListener(t,e,s.applyPassive())},deregisterDocumentInteractionHandler:function(t,e){return document.documentElement.removeEventListener(t,e,s.applyPassive())},registerResizeHandler:function(t){return window.addEventListener("resize",t)},deregisterResizeHandler:function(t){return window.removeEventListener("resize",t)},updateCssVariable:function(e,n){return t.root_.style.setProperty(e,n)},computeBoundingRect:function(){return t.root_.getBoundingClientRect()},getWindowPageOffset:function(){return{x:window.pageXOffset,y:window.pageYOffset}}}}}]),e}(o.a),f=function t(){i(this,t)};f.prototype.root_,f.prototype.unbounded,f.prototype.disabled},47:function(t,e,n){"use strict";function i(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function r(t,e){if(!t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!e||"object"!=typeof e&&"function"!=typeof e?t:e}function a(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),e&&(Object.setPrototypeOf?Object.setPrototypeOf(t,e):t.__proto__=e)}var o=n(0),u=(n(66),n(142)),s=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&(t[i]=n[i])}return t},c=function(){function t(t,e){for(var n=0;n<e.length;n++){var i=e[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}return function(e,n,i){return n&&t(e.prototype,n),i&&t(e,i),e}}(),l=function(t){function e(t){return i(this,e),r(this,(e.__proto__||Object.getPrototypeOf(e)).call(this,s(e.defaultAdapter,t)))}return a(e,t),c(e,null,[{key:"cssClasses",get:function(){return u.a}},{key:"strings",get:function(){return u.b}},{key:"defaultAdapter",get:function(){return{addClass:function(){},removeClass:function(){},hasClass:function(){},setAttr:function(){},removeAttr:function(){},setContent:function(){}}}}]),c(e,[{key:"setContent",value:function(t){this.adapter_.setContent(t)}},{key:"setPersistent",value:function(t){t?this.adapter_.addClass(u.a.HELPER_TEXT_PERSISTENT):this.adapter_.removeClass(u.a.HELPER_TEXT_PERSISTENT)}},{key:"setValidation",value:function(t){t?this.adapter_.addClass(u.a.HELPER_TEXT_VALIDATION_MSG):this.adapter_.removeClass(u.a.HELPER_TEXT_VALIDATION_MSG)}},{key:"showToScreenReader",value:function(){this.adapter_.removeAttr(u.b.ARIA_HIDDEN)}},{key:"setValidity",value:function(t){var e=this.adapter_.hasClass(u.a.HELPER_TEXT_PERSISTENT),n=this.adapter_.hasClass(u.a.HELPER_TEXT_VALIDATION_MSG),i=n&&!t;i?this.adapter_.setAttr(u.b.ROLE,"alert"):this.adapter_.removeAttr(u.b.ROLE),e||i||this.hide_()}},{key:"hide_",value:function(){this.adapter_.setAttr(u.b.ARIA_HIDDEN,"true")}}]),e}(o.a);e.a=l},48:function(t,e,n){"use strict";function i(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function r(t,e){if(!t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!e||"object"!=typeof e&&"function"!=typeof e?t:e}function a(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),e&&(Object.setPrototypeOf?Object.setPrototypeOf(t,e):t.__proto__=e)}var o=n(0),u=(n(67),n(143)),s=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&(t[i]=n[i])}return t},c=function(){function t(t,e){for(var n=0;n<e.length;n++){var i=e[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}return function(e,n,i){return n&&t(e.prototype,n),i&&t(e,i),e}}(),l=function(t){function e(t){i(this,e);var n=r(this,(e.__proto__||Object.getPrototypeOf(e)).call(this,s(e.defaultAdapter,t)));return n.savedTabIndex_=null,n.interactionHandler_=function(t){return n.handleInteraction(t)},n}return a(e,t),c(e,null,[{key:"strings",get:function(){return u.a}},{key:"defaultAdapter",get:function(){return{getAttr:function(){},setAttr:function(){},removeAttr:function(){},setContent:function(){},registerInteractionHandler:function(){},deregisterInteractionHandler:function(){},notifyIconAction:function(){}}}}]),c(e,[{key:"init",value:function(){var t=this;this.savedTabIndex_=this.adapter_.getAttr("tabindex"),["click","keydown"].forEach(function(e){t.adapter_.registerInteractionHandler(e,t.interactionHandler_)})}},{key:"destroy",value:function(){var t=this;["click","keydown"].forEach(function(e){t.adapter_.deregisterInteractionHandler(e,t.interactionHandler_)})}},{key:"setDisabled",value:function(t){this.savedTabIndex_&&(t?(this.adapter_.setAttr("tabindex","-1"),this.adapter_.removeAttr("role")):(this.adapter_.setAttr("tabindex",this.savedTabIndex_),this.adapter_.setAttr("role",u.a.ICON_ROLE)))}},{key:"setAriaLabel",value:function(t){this.adapter_.setAttr("aria-label",t)}},{key:"setContent",value:function(t){this.adapter_.setContent(t)}},{key:"handleInteraction",value:function(t){"click"!==t.type&&"Enter"!==t.key&&13!==t.keyCode||this.adapter_.notifyIconAction()}}]),e}(o.a);e.a=l},5:function(t,e,n){"use strict";function i(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function r(t,e){if(!t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!e||"object"!=typeof e&&"function"!=typeof e?t:e}function a(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),e&&(Object.setPrototypeOf?Object.setPrototypeOf(t,e):t.__proto__=e)}var o=n(0),u=(n(3),n(6)),s=n(2),c=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&(t[i]=n[i])}return t},l=function(){function t(t,e){for(var n=0;n<e.length;n++){var i=e[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}return function(e,n,i){return n&&t(e.prototype,n),i&&t(e,i),e}}(),f=["touchstart","pointerdown","mousedown","keydown"],d=["touchend","pointerup","mouseup"],p=[],h=function(t){function e(t){i(this,e);var n=r(this,(e.__proto__||Object.getPrototypeOf(e)).call(this,c(e.defaultAdapter,t)));return n.layoutFrame_=0,n.frame_={width:0,height:0},n.activationState_=n.defaultActivationState_(),n.initialSize_=0,n.maxRadius_=0,n.activateHandler_=function(t){return n.activate_(t)},n.deactivateHandler_=function(t){return n.deactivate_(t)},n.focusHandler_=function(){return n.handleFocus()},n.blurHandler_=function(){return n.handleBlur()},n.resizeHandler_=function(){return n.layout()},n.unboundedCoords_={left:0,top:0},n.fgScale_=0,n.activationTimer_=0,n.fgDeactivationRemovalTimer_=0,n.activationAnimationHasEnded_=!1,n.activationTimerCallback_=function(){n.activationAnimationHasEnded_=!0,n.runDeactivationUXLogicIfReady_()},n.previousActivationEvent_=null,n}return a(e,t),l(e,null,[{key:"cssClasses",get:function(){return u.a}},{key:"strings",get:function(){return u.c}},{key:"numbers",get:function(){return u.b}},{key:"defaultAdapter",get:function(){return{browserSupportsCssVars:function(){},isUnbounded:function(){},isSurfaceActive:function(){},isSurfaceDisabled:function(){},addClass:function(){},removeClass:function(){},containsEventTarget:function(){},registerInteractionHandler:function(){},deregisterInteractionHandler:function(){},registerDocumentInteractionHandler:function(){},deregisterDocumentInteractionHandler:function(){},registerResizeHandler:function(){},deregisterResizeHandler:function(){},updateCssVariable:function(){},computeBoundingRect:function(){},getWindowPageOffset:function(){}}}}]),l(e,[{key:"supportsPressRipple_",value:function(){return this.adapter_.browserSupportsCssVars()}},{key:"defaultActivationState_",value:function(){return{isActivated:!1,hasDeactivationUXRun:!1,wasActivatedByPointer:!1,wasElementMadeActive:!1,activationEvent:null,isProgrammatic:!1}}},{key:"init",value:function(){var t=this,n=this.supportsPressRipple_();if(this.registerRootHandlers_(n),n){var i=e.cssClasses,r=i.ROOT,a=i.UNBOUNDED;requestAnimationFrame(function(){t.adapter_.addClass(r),t.adapter_.isUnbounded()&&(t.adapter_.addClass(a),t.layoutInternal_())})}}},{key:"destroy",value:function(){var t=this;if(this.supportsPressRipple_()){if(this.activationTimer_){clearTimeout(this.activationTimer_),this.activationTimer_=0;var n=e.cssClasses.FG_ACTIVATION;this.adapter_.removeClass(n)}var i=e.cssClasses,r=i.ROOT,a=i.UNBOUNDED;requestAnimationFrame(function(){t.adapter_.removeClass(r),t.adapter_.removeClass(a),t.removeCssVars_()})}this.deregisterRootHandlers_(),this.deregisterDeactivationHandlers_()}},{key:"registerRootHandlers_",value:function(t){var e=this;t&&(f.forEach(function(t){e.adapter_.registerInteractionHandler(t,e.activateHandler_)}),this.adapter_.isUnbounded()&&this.adapter_.registerResizeHandler(this.resizeHandler_)),this.adapter_.registerInteractionHandler("focus",this.focusHandler_),this.adapter_.registerInteractionHandler("blur",this.blurHandler_)}},{key:"registerDeactivationHandlers_",value:function(t){var e=this;"keydown"===t.type?this.adapter_.registerInteractionHandler("keyup",this.deactivateHandler_):d.forEach(function(t){e.adapter_.registerDocumentInteractionHandler(t,e.deactivateHandler_)})}},{key:"deregisterRootHandlers_",value:function(){var t=this;f.forEach(function(e){t.adapter_.deregisterInteractionHandler(e,t.activateHandler_)}),this.adapter_.deregisterInteractionHandler("focus",this.focusHandler_),this.adapter_.deregisterInteractionHandler("blur",this.blurHandler_),this.adapter_.isUnbounded()&&this.adapter_.deregisterResizeHandler(this.resizeHandler_)}},{key:"deregisterDeactivationHandlers_",value:function(){var t=this;this.adapter_.deregisterInteractionHandler("keyup",this.deactivateHandler_),d.forEach(function(e){t.adapter_.deregisterDocumentInteractionHandler(e,t.deactivateHandler_)})}},{key:"removeCssVars_",value:function(){var t=this,n=e.strings;Object.keys(n).forEach(function(e){0===e.indexOf("VAR_")&&t.adapter_.updateCssVariable(n[e],null)})}},{key:"activate_",value:function(t){var e=this;if(!this.adapter_.isSurfaceDisabled()){var n=this.activationState_;if(!n.isActivated){var i=this.previousActivationEvent_;if(!(i&&t&&i.type!==t.type)){n.isActivated=!0,n.isProgrammatic=null===t,n.activationEvent=t,n.wasActivatedByPointer=!n.isProgrammatic&&("mousedown"===t.type||"touchstart"===t.type||"pointerdown"===t.type);if(t&&p.length>0&&p.some(function(t){return e.adapter_.containsEventTarget(t)}))return void this.resetActivationState_();t&&(p.push(t.target),this.registerDeactivationHandlers_(t)),n.wasElementMadeActive=this.checkElementMadeActive_(t),n.wasElementMadeActive&&this.animateActivation_(),requestAnimationFrame(function(){p=[],n.wasElementMadeActive||" "!==t.key&&32!==t.keyCode||(n.wasElementMadeActive=e.checkElementMadeActive_(t),n.wasElementMadeActive&&e.animateActivation_()),n.wasElementMadeActive||(e.activationState_=e.defaultActivationState_())})}}}}},{key:"checkElementMadeActive_",value:function(t){return!t||"keydown"!==t.type||this.adapter_.isSurfaceActive()}},{key:"activate",value:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:null;this.activate_(t)}},{key:"animateActivation_",value:function(){var t=this,n=e.strings,i=n.VAR_FG_TRANSLATE_START,r=n.VAR_FG_TRANSLATE_END,a=e.cssClasses,o=a.FG_DEACTIVATION,u=a.FG_ACTIVATION,s=e.numbers.DEACTIVATION_TIMEOUT_MS;this.layoutInternal_();var c="",l="";if(!this.adapter_.isUnbounded()){var f=this.getFgTranslationCoordinates_(),d=f.startPoint,p=f.endPoint;c=d.x+"px, "+d.y+"px",l=p.x+"px, "+p.y+"px"}this.adapter_.updateCssVariable(i,c),this.adapter_.updateCssVariable(r,l),clearTimeout(this.activationTimer_),clearTimeout(this.fgDeactivationRemovalTimer_),this.rmBoundedActivationClasses_(),this.adapter_.removeClass(o),this.adapter_.computeBoundingRect(),this.adapter_.addClass(u),this.activationTimer_=setTimeout(function(){return t.activationTimerCallback_()},s)}},{key:"getFgTranslationCoordinates_",value:function(){var t=this.activationState_,e=t.activationEvent,n=t.wasActivatedByPointer,i=void 0;return i=n?Object(s.getNormalizedEventCoords)(e,this.adapter_.getWindowPageOffset(),this.adapter_.computeBoundingRect()):{x:this.frame_.width/2,y:this.frame_.height/2},i={x:i.x-this.initialSize_/2,y:i.y-this.initialSize_/2},{startPoint:i,endPoint:{x:this.frame_.width/2-this.initialSize_/2,y:this.frame_.height/2-this.initialSize_/2}}}},{key:"runDeactivationUXLogicIfReady_",value:function(){var t=this,n=e.cssClasses.FG_DEACTIVATION,i=this.activationState_,r=i.hasDeactivationUXRun,a=i.isActivated;(r||!a)&&this.activationAnimationHasEnded_&&(this.rmBoundedActivationClasses_(),this.adapter_.addClass(n),this.fgDeactivationRemovalTimer_=setTimeout(function(){t.adapter_.removeClass(n)},u.b.FG_DEACTIVATION_MS))}},{key:"rmBoundedActivationClasses_",value:function(){var t=e.cssClasses.FG_ACTIVATION;this.adapter_.removeClass(t),this.activationAnimationHasEnded_=!1,this.adapter_.computeBoundingRect()}},{key:"resetActivationState_",value:function(){var t=this;this.previousActivationEvent_=this.activationState_.activationEvent,this.activationState_=this.defaultActivationState_(),setTimeout(function(){return t.previousActivationEvent_=null},e.numbers.TAP_DELAY_MS)}},{key:"deactivate_",value:function(t){var e=this,n=this.activationState_;if(n.isActivated){var i=c({},n);if(n.isProgrammatic){requestAnimationFrame(function(){return e.animateDeactivation_(null,i)}),this.resetActivationState_()}else this.deregisterDeactivationHandlers_(),requestAnimationFrame(function(){e.activationState_.hasDeactivationUXRun=!0,e.animateDeactivation_(t,i),e.resetActivationState_()})}}},{key:"deactivate",value:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:null;this.deactivate_(t)}},{key:"animateDeactivation_",value:function(t,e){var n=e.wasActivatedByPointer,i=e.wasElementMadeActive;(n||i)&&this.runDeactivationUXLogicIfReady_()}},{key:"layout",value:function(){var t=this;this.layoutFrame_&&cancelAnimationFrame(this.layoutFrame_),this.layoutFrame_=requestAnimationFrame(function(){t.layoutInternal_(),t.layoutFrame_=0})}},{key:"layoutInternal_",value:function(){var t=this;this.frame_=this.adapter_.computeBoundingRect();var n=Math.max(this.frame_.height,this.frame_.width);this.maxRadius_=this.adapter_.isUnbounded()?n:function(){return Math.sqrt(Math.pow(t.frame_.width,2)+Math.pow(t.frame_.height,2))+e.numbers.PADDING}(),this.initialSize_=n*e.numbers.INITIAL_ORIGIN_SCALE,this.fgScale_=this.maxRadius_/this.initialSize_,this.updateLayoutCssVars_()}},{key:"updateLayoutCssVars_",value:function(){var t=e.strings,n=t.VAR_FG_SIZE,i=t.VAR_LEFT,r=t.VAR_TOP,a=t.VAR_FG_SCALE;this.adapter_.updateCssVariable(n,this.initialSize_+"px"),this.adapter_.updateCssVariable(a,this.fgScale_),this.adapter_.isUnbounded()&&(this.unboundedCoords_={left:Math.round(this.frame_.width/2-this.initialSize_/2),top:Math.round(this.frame_.height/2-this.initialSize_/2)},this.adapter_.updateCssVariable(i,this.unboundedCoords_.left+"px"),this.adapter_.updateCssVariable(r,this.unboundedCoords_.top+"px"))}},{key:"setUnbounded",value:function(t){var n=e.cssClasses.UNBOUNDED;t?this.adapter_.addClass(n):this.adapter_.removeClass(n)}},{key:"handleFocus",value:function(){var t=this;requestAnimationFrame(function(){return t.adapter_.addClass(e.cssClasses.BG_FOCUSED)})}},{key:"handleBlur",value:function(){var t=this;requestAnimationFrame(function(){return t.adapter_.removeClass(e.cssClasses.BG_FOCUSED)})}}]),e}(o.a);e.a=h},6:function(t,e,n){"use strict";n.d(e,"a",function(){return i}),n.d(e,"c",function(){return r}),n.d(e,"b",function(){return a});/**
+ * @license
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+var i={ROOT:"mdc-ripple-upgraded",UNBOUNDED:"mdc-ripple-upgraded--unbounded",BG_FOCUSED:"mdc-ripple-upgraded--background-focused",FG_ACTIVATION:"mdc-ripple-upgraded--foreground-activation",FG_DEACTIVATION:"mdc-ripple-upgraded--foreground-deactivation"},r={VAR_LEFT:"--mdc-ripple-left",VAR_TOP:"--mdc-ripple-top",VAR_FG_SIZE:"--mdc-ripple-fg-size",VAR_FG_SCALE:"--mdc-ripple-fg-scale",VAR_FG_TRANSLATE_START:"--mdc-ripple-fg-translate-start",VAR_FG_TRANSLATE_END:"--mdc-ripple-fg-translate-end"},a={PADDING:10,INITIAL_ORIGIN_SCALE:.6,DEACTIVATION_TIMEOUT_MS:225,FG_DEACTIVATION_MS:150,TAP_DELAY_MS:300}},64:function(t,e,n){"use strict";n.d(e,"b",function(){return r}),n.d(e,"d",function(){return i}),n.d(e,"c",function(){return a}),n.d(e,"a",function(){return o});/**
+ * @license
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+var i={ARIA_CONTROLS:"aria-controls",INPUT_SELECTOR:".mdc-text-field__input",LABEL_SELECTOR:".mdc-floating-label",ICON_SELECTOR:".mdc-text-field__icon",OUTLINE_SELECTOR:".mdc-notched-outline",LINE_RIPPLE_SELECTOR:".mdc-line-ripple"},r={ROOT:"mdc-text-field",UPGRADED:"mdc-text-field--upgraded",DISABLED:"mdc-text-field--disabled",DENSE:"mdc-text-field--dense",FOCUSED:"mdc-text-field--focused",INVALID:"mdc-text-field--invalid",BOX:"mdc-text-field--box",OUTLINED:"mdc-text-field--outlined"},a={LABEL_SCALE:.75,DENSE_LABEL_SCALE:.923},o=["pattern","min","max","required","step","minlength","maxlength"]},65:function(t,e,n){"use strict";function i(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}var r=(n(47),n(48),function(){function t(t,e){for(var n=0;n<e.length;n++){var i=e[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}return function(e,n,i){return n&&t(e.prototype,n),i&&t(e,i),e}}());!function(){function t(){i(this,t)}r(t,[{key:"addClass",value:function(t){}},{key:"removeClass",value:function(t){}},{key:"hasClass",value:function(t){}},{key:"registerTextFieldInteractionHandler",value:function(t,e){}},{key:"deregisterTextFieldInteractionHandler",value:function(t,e){}},{key:"registerInputInteractionHandler",value:function(t,e){}},{key:"deregisterInputInteractionHandler",value:function(t,e){}},{key:"registerValidationAttributeChangeHandler",value:function(t){}},{key:"deregisterValidationAttributeChangeHandler",value:function(t){}},{key:"getNativeInput",value:function(){}},{key:"isFocused",value:function(){}},{key:"isRtl",value:function(){}},{key:"activateLineRipple",value:function(){}},{key:"deactivateLineRipple",value:function(){}},{key:"setLineRippleTransformOrigin",value:function(t){}},{key:"shakeLabel",value:function(t){}},{key:"floatLabel",value:function(t){}},{key:"hasLabel",value:function(){}},{key:"getLabelWidth",value:function(){}},{key:"hasOutline",value:function(){}},{key:"notchOutline",value:function(t,e){}},{key:"closeOutline",value:function(){}}])}()},66:function(t,e,n){"use strict";function i(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}var r=function(){function t(t,e){for(var n=0;n<e.length;n++){var i=e[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}return function(e,n,i){return n&&t(e.prototype,n),i&&t(e,i),e}}();!function(){function t(){i(this,t)}r(t,[{key:"addClass",value:function(t){}},{key:"removeClass",value:function(t){}},{key:"hasClass",value:function(t){}},{key:"setAttr",value:function(t,e){}},{key:"removeAttr",value:function(t){}},{key:"setContent",value:function(t){}}])}()},67:function(t,e,n){"use strict";function i(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}var r=function(){function t(t,e){for(var n=0;n<e.length;n++){var i=e[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}return function(e,n,i){return n&&t(e.prototype,n),i&&t(e,i),e}}();!function(){function t(){i(this,t)}r(t,[{key:"getAttr",value:function(t){}},{key:"setAttr",value:function(t,e){}},{key:"removeAttr",value:function(t){}},{key:"setContent",value:function(t){}},{key:"registerInteractionHandler",value:function(t,e){}},{key:"deregisterInteractionHandler",value:function(t,e){}},{key:"notifyIconAction",value:function(){}}])}()}})});
+//# sourceMappingURL=mdc.textfield.min.js.map
\ No newline at end of file
diff --git a/node_modules/@material/textfield/foundation.js b/node_modules/@material/textfield/foundation.js
new file mode 100644
index 0000000..9991686
--- /dev/null
+++ b/node_modules/@material/textfield/foundation.js
@@ -0,0 +1,440 @@
+/**
+ * @license
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import MDCFoundation from '@material/base/foundation';
+/* eslint-disable no-unused-vars */
+import MDCTextFieldHelperTextFoundation from './helper-text/foundation';
+import MDCTextFieldIconFoundation from './icon/foundation';
+/* eslint-enable no-unused-vars */
+import {MDCTextFieldAdapter, NativeInputType, FoundationMapType} from './adapter';
+import {cssClasses, strings, numbers, VALIDATION_ATTR_WHITELIST} from './constants';
+
+
+/**
+ * @extends {MDCFoundation<!MDCTextFieldAdapter>}
+ * @final
+ */
+class MDCTextFieldFoundation extends MDCFoundation {
+  /** @return enum {string} */
+  static get cssClasses() {
+    return cssClasses;
+  }
+
+  /** @return enum {string} */
+  static get strings() {
+    return strings;
+  }
+
+  /** @return enum {string} */
+  static get numbers() {
+    return numbers;
+  }
+
+  /** @return {boolean} */
+  get shouldShake() {
+    return !this.isValid() && !this.isFocused_;
+  }
+
+  /** @return {boolean} */
+  get shouldFloat() {
+    return this.isFocused_ || !!this.getValue() || this.isBadInput_();
+  }
+
+  /**
+   * {@see MDCTextFieldAdapter} for typing information on parameters and return
+   * types.
+   * @return {!MDCTextFieldAdapter}
+   */
+  static get defaultAdapter() {
+    return /** @type {!MDCTextFieldAdapter} */ ({
+      addClass: () => {},
+      removeClass: () => {},
+      hasClass: () => {},
+      registerTextFieldInteractionHandler: () => {},
+      deregisterTextFieldInteractionHandler: () => {},
+      registerInputInteractionHandler: () => {},
+      deregisterInputInteractionHandler: () => {},
+      registerValidationAttributeChangeHandler: () => {},
+      deregisterValidationAttributeChangeHandler: () => {},
+      getNativeInput: () => {},
+      isFocused: () => {},
+      isRtl: () => {},
+      activateLineRipple: () => {},
+      deactivateLineRipple: () => {},
+      setLineRippleTransformOrigin: () => {},
+      shakeLabel: () => {},
+      floatLabel: () => {},
+      hasLabel: () => {},
+      getLabelWidth: () => {},
+      hasOutline: () => {},
+      notchOutline: () => {},
+      closeOutline: () => {},
+    });
+  }
+
+  /**
+   * @param {!MDCTextFieldAdapter} adapter
+   * @param {!FoundationMapType=} foundationMap Map from subcomponent names to their subfoundations.
+   */
+  constructor(adapter, foundationMap = /** @type {!FoundationMapType} */ ({})) {
+    super(Object.assign(MDCTextFieldFoundation.defaultAdapter, adapter));
+
+    /** @type {!MDCTextFieldHelperTextFoundation|undefined} */
+    this.helperText_ = foundationMap.helperText;
+    /** @type {!MDCTextFieldIconFoundation|undefined} */
+    this.icon_ = foundationMap.icon;
+
+    /** @private {boolean} */
+    this.isFocused_ = false;
+    /** @private {boolean} */
+    this.receivedUserInput_ = false;
+    /** @private {boolean} */
+    this.useCustomValidityChecking_ = false;
+    /** @private {boolean} */
+    this.isValid_ = true;
+    /** @private {function(): undefined} */
+    this.inputFocusHandler_ = () => this.activateFocus();
+    /** @private {function(): undefined} */
+    this.inputBlurHandler_ = () => this.deactivateFocus();
+    /** @private {function(): undefined} */
+    this.inputInputHandler_ = () => this.autoCompleteFocus();
+    /** @private {function(!Event): undefined} */
+    this.setPointerXOffset_ = (evt) => this.setTransformOrigin(evt);
+    /** @private {function(!Event): undefined} */
+    this.textFieldInteractionHandler_ = () => this.handleTextFieldInteraction();
+    /** @private {function(!Array): undefined} */
+    this.validationAttributeChangeHandler_ = (attributesList) => this.handleValidationAttributeChange(attributesList);
+
+    /** @private {!MutationObserver} */
+    this.validationObserver_;
+  }
+
+  init() {
+    this.adapter_.addClass(MDCTextFieldFoundation.cssClasses.UPGRADED);
+    // Ensure label does not collide with any pre-filled value.
+    if (this.adapter_.hasLabel() && (this.getValue() || this.isBadInput_())) {
+      this.adapter_.floatLabel(this.shouldFloat);
+      this.notchOutline(this.shouldFloat);
+    }
+
+    if (this.adapter_.isFocused()) {
+      this.inputFocusHandler_();
+    }
+
+    this.adapter_.registerInputInteractionHandler('focus', this.inputFocusHandler_);
+    this.adapter_.registerInputInteractionHandler('blur', this.inputBlurHandler_);
+    this.adapter_.registerInputInteractionHandler('input', this.inputInputHandler_);
+    ['mousedown', 'touchstart'].forEach((evtType) => {
+      this.adapter_.registerInputInteractionHandler(evtType, this.setPointerXOffset_);
+    });
+    ['click', 'keydown'].forEach((evtType) => {
+      this.adapter_.registerTextFieldInteractionHandler(evtType, this.textFieldInteractionHandler_);
+    });
+    this.validationObserver_ =
+        this.adapter_.registerValidationAttributeChangeHandler(this.validationAttributeChangeHandler_);
+  }
+
+  destroy() {
+    this.adapter_.removeClass(MDCTextFieldFoundation.cssClasses.UPGRADED);
+    this.adapter_.deregisterInputInteractionHandler('focus', this.inputFocusHandler_);
+    this.adapter_.deregisterInputInteractionHandler('blur', this.inputBlurHandler_);
+    this.adapter_.deregisterInputInteractionHandler('input', this.inputInputHandler_);
+    ['mousedown', 'touchstart'].forEach((evtType) => {
+      this.adapter_.deregisterInputInteractionHandler(evtType, this.setPointerXOffset_);
+    });
+    ['click', 'keydown'].forEach((evtType) => {
+      this.adapter_.deregisterTextFieldInteractionHandler(evtType, this.textFieldInteractionHandler_);
+    });
+    this.adapter_.deregisterValidationAttributeChangeHandler(this.validationObserver_);
+  }
+
+  /**
+   * Handles user interactions with the Text Field.
+   */
+  handleTextFieldInteraction() {
+    if (this.adapter_.getNativeInput().disabled) {
+      return;
+    }
+    this.receivedUserInput_ = true;
+  }
+
+  /**
+   * Handles validation attribute changes
+   * @param {!Array<string>} attributesList
+   */
+  handleValidationAttributeChange(attributesList) {
+    attributesList.some((attributeName) => {
+      if (VALIDATION_ATTR_WHITELIST.indexOf(attributeName) > -1) {
+        this.styleValidity_(true);
+        return true;
+      }
+    });
+  }
+
+  /**
+   * Opens/closes the notched outline.
+   * @param {boolean} openNotch
+   */
+  notchOutline(openNotch) {
+    if (!this.adapter_.hasOutline() || !this.adapter_.hasLabel()) {
+      return;
+    }
+
+    if (openNotch) {
+      const isDense = this.adapter_.hasClass(cssClasses.DENSE);
+      const labelScale = isDense ? numbers.DENSE_LABEL_SCALE : numbers.LABEL_SCALE;
+      const labelWidth = this.adapter_.getLabelWidth() * labelScale;
+      const isRtl = this.adapter_.isRtl();
+      this.adapter_.notchOutline(labelWidth, isRtl);
+    } else {
+      this.adapter_.closeOutline();
+    }
+  }
+
+  /**
+   * Activates the text field focus state.
+   */
+  activateFocus() {
+    this.isFocused_ = true;
+    this.styleFocused_(this.isFocused_);
+    this.adapter_.activateLineRipple();
+    this.notchOutline(this.shouldFloat);
+    if (this.adapter_.hasLabel()) {
+      this.adapter_.shakeLabel(this.shouldShake);
+      this.adapter_.floatLabel(this.shouldFloat);
+    }
+    if (this.helperText_) {
+      this.helperText_.showToScreenReader();
+    }
+  }
+
+  /**
+   * Sets the line ripple's transform origin, so that the line ripple activate
+   * animation will animate out from the user's click location.
+   * @param {!Event} evt
+   */
+  setTransformOrigin(evt) {
+    const targetClientRect = evt.target.getBoundingClientRect();
+    const evtCoords = {x: evt.clientX, y: evt.clientY};
+    const normalizedX = evtCoords.x - targetClientRect.left;
+    this.adapter_.setLineRippleTransformOrigin(normalizedX);
+  }
+
+  /**
+   * Activates the Text Field's focus state in cases when the input value
+   * changes without user input (e.g. programatically).
+   */
+  autoCompleteFocus() {
+    if (!this.receivedUserInput_) {
+      this.activateFocus();
+    }
+  }
+
+  /**
+   * Deactivates the Text Field's focus state.
+   */
+  deactivateFocus() {
+    this.isFocused_ = false;
+    this.adapter_.deactivateLineRipple();
+    const input = this.getNativeInput_();
+    const shouldRemoveLabelFloat = !input.value && !this.isBadInput_();
+    const isValid = this.isValid();
+    this.styleValidity_(isValid);
+    this.styleFocused_(this.isFocused_);
+    if (this.adapter_.hasLabel()) {
+      this.adapter_.shakeLabel(this.shouldShake);
+      this.adapter_.floatLabel(this.shouldFloat);
+      this.notchOutline(this.shouldFloat);
+    }
+    if (shouldRemoveLabelFloat) {
+      this.receivedUserInput_ = false;
+    }
+  }
+
+  /**
+   * @return {string} The value of the input Element.
+   */
+  getValue() {
+    return this.getNativeInput_().value;
+  }
+
+  /**
+   * @param {string} value The value to set on the input Element.
+   */
+  setValue(value) {
+    this.getNativeInput_().value = value;
+    const isValid = this.isValid();
+    this.styleValidity_(isValid);
+    if (this.adapter_.hasLabel()) {
+      this.adapter_.shakeLabel(this.shouldShake);
+      this.adapter_.floatLabel(this.shouldFloat);
+      this.notchOutline(this.shouldFloat);
+    }
+  }
+
+  /**
+   * @return {boolean} If a custom validity is set, returns that value.
+   *     Otherwise, returns the result of native validity checks.
+   */
+  isValid() {
+    return this.useCustomValidityChecking_
+      ? this.isValid_ : this.isNativeInputValid_();
+  }
+
+  /**
+   * @param {boolean} isValid Sets the validity state of the Text Field.
+   */
+  setValid(isValid) {
+    this.useCustomValidityChecking_ = true;
+    this.isValid_ = isValid;
+    // Retrieve from the getter to ensure correct logic is applied.
+    isValid = this.isValid();
+    this.styleValidity_(isValid);
+    if (this.adapter_.hasLabel()) {
+      this.adapter_.shakeLabel(this.shouldShake);
+    }
+  }
+
+  /**
+   * @return {boolean} True if the Text Field is disabled.
+   */
+  isDisabled() {
+    return this.getNativeInput_().disabled;
+  }
+
+  /**
+   * @param {boolean} disabled Sets the text-field disabled or enabled.
+   */
+  setDisabled(disabled) {
+    this.getNativeInput_().disabled = disabled;
+    this.styleDisabled_(disabled);
+  }
+
+  /**
+   * @param {string} content Sets the content of the helper text.
+   */
+  setHelperTextContent(content) {
+    if (this.helperText_) {
+      this.helperText_.setContent(content);
+    }
+  }
+
+  /**
+   * Sets the aria label of the icon.
+   * @param {string} label
+   */
+  setIconAriaLabel(label) {
+    if (this.icon_) {
+      this.icon_.setAriaLabel(label);
+    }
+  }
+
+  /**
+   * Sets the text content of the icon.
+   * @param {string} content
+   */
+  setIconContent(content) {
+    if (this.icon_) {
+      this.icon_.setContent(content);
+    }
+  }
+
+  /**
+   * @return {boolean} True if the Text Field input fails in converting the
+   *     user-supplied value.
+   * @private
+   */
+  isBadInput_() {
+    return this.getNativeInput_().validity.badInput;
+  }
+
+  /**
+   * @return {boolean} The result of native validity checking
+   *     (ValidityState.valid).
+   */
+  isNativeInputValid_() {
+    return this.getNativeInput_().validity.valid;
+  }
+
+  /**
+   * Styles the component based on the validity state.
+   * @param {boolean} isValid
+   * @private
+   */
+  styleValidity_(isValid) {
+    const {INVALID} = MDCTextFieldFoundation.cssClasses;
+    if (isValid) {
+      this.adapter_.removeClass(INVALID);
+    } else {
+      this.adapter_.addClass(INVALID);
+    }
+    if (this.helperText_) {
+      this.helperText_.setValidity(isValid);
+    }
+  }
+
+  /**
+   * Styles the component based on the focused state.
+   * @param {boolean} isFocused
+   * @private
+   */
+  styleFocused_(isFocused) {
+    const {FOCUSED} = MDCTextFieldFoundation.cssClasses;
+    if (isFocused) {
+      this.adapter_.addClass(FOCUSED);
+    } else {
+      this.adapter_.removeClass(FOCUSED);
+    }
+  }
+
+  /**
+   * Styles the component based on the disabled state.
+   * @param {boolean} isDisabled
+   * @private
+   */
+  styleDisabled_(isDisabled) {
+    const {DISABLED, INVALID} = MDCTextFieldFoundation.cssClasses;
+    if (isDisabled) {
+      this.adapter_.addClass(DISABLED);
+      this.adapter_.removeClass(INVALID);
+    } else {
+      this.adapter_.removeClass(DISABLED);
+    }
+    if (this.icon_) {
+      this.icon_.setDisabled(isDisabled);
+    }
+  }
+
+  /**
+   * @return {!Element|!NativeInputType} The native text input from the
+   * host environment, or a dummy if none exists.
+   * @private
+   */
+  getNativeInput_() {
+    return this.adapter_.getNativeInput() ||
+    /** @type {!NativeInputType} */ ({
+      value: '',
+      disabled: false,
+      validity: {
+        badInput: false,
+        valid: true,
+      },
+    });
+  }
+}
+
+export default MDCTextFieldFoundation;
diff --git a/node_modules/@material/textfield/helper-text/README.md b/node_modules/@material/textfield/helper-text/README.md
new file mode 100644
index 0000000..a32e623
--- /dev/null
+++ b/node_modules/@material/textfield/helper-text/README.md
@@ -0,0 +1,117 @@
+<!--docs:
+title: "Text Field Helper Text"
+layout: detail
+section: components
+excerpt: "The helper text provides supplemental information and/or validation messages to users"
+iconId: text_field
+path: /catalog/input-controls/text-field/helper-text/
+-->
+
+# Text Field Helper Text
+
+Helper text gives context about a field’s input, such as how the input will be used. It should be visible either persistently or only on focus.
+
+## Design & API Documentation
+
+<ul class="icon-list">
+  <li class="icon-list-item icon-list-item--spec">
+    <a href="https://material.io/go/design-text-fields#text-fields-layout">Material Design guidelines: Text Fields Layout</a>
+  </li>
+</ul>
+
+## Basic Usage
+
+### HTML Structure
+
+```html
+<p class="mdc-text-field-helper-text" aria-hidden="true">
+```
+
+### Styles
+
+```scss
+@import "@material/textfield/helper-text/mdc-text-field-helper-text";
+```
+
+### JavaScript Instantiation
+
+```js
+import {MDCTextFieldHelperText} from '@material/textfield/helper-text';
+
+const helperText = new MDCTextFieldHelperText(document.querySelector('.mdc-text-field-helper-text'));
+```
+
+#### Accessibility
+
+Note that in every example where the helper text is dependent on the state of the input element, we
+assign an id to the `mdc-text-field-helper-text` element and set that id to the value of the
+`aria-controls` and `aria-describedby` attributes on the input element. We recommend doing this as well as it will help
+indicate to assistive devices that the display of the helper text is dependent on the interaction with
+the input element.
+
+```html
+<div class="mdc-text-field">
+  <input type="text" id="username" class="mdc-text-field__input"
+         aria-controls="username-helper-text"
+         aria-describedby="username-helper-text">
+  <label for="username" class="mdc-floating-label">Username</label>
+  <div class="mdc-line-ripple"></div>
+</div>
+<p id="username-helper-text" class="mdc-text-field-helper-text" aria-hidden="true">
+  This will be displayed on your public profile
+</p>
+```
+
+When using our vanilla JS component, if the browser sees that the input element has an `aria-controls`
+attribute, it will look for an element with the id specified and treat it as the text field's helper
+text element, taking care of adding/removing `aria-hidden` and other accessibility attributes. Adding
+and removing classes and attributes to the helper text element can also be done using the
+MDCTextFieldHelperText API, which is described below.
+
+## Style Customization
+
+### CSS Classes
+
+CSS Class | Description
+--- | ---
+`mdc-text-field-helper-text` | Mandatory.
+`mdc-text-field-helper-text--persistent` | Makes the helper text permanently visible.
+`mdc-text-field-helper-text--validation-msg` | Indicates the helper text is a validation message.
+
+### Sass Mixins
+
+Mixin | Description
+--- | ---
+`mdc-text-field-helper-text-color($color)` | Customizes the color of the helper text following a text-field.
+`mdc-text-field-helper-text-validation-color($color)` | Customizes the color of the helper text when it's used as a validation message.
+
+## `MDCTextFieldHelperText` Properties and Methods
+
+Property | Value Type | Description
+--- | --- | ---
+`foundation` | `MDCTextFieldHelperTextFoundation` | Returns the helper text's foundation. This allows the parent `MDCTextField` component to access the public methods on the `MDCTextFieldHelperTextFoundation` class.
+
+## Usage Within Frameworks
+
+If you are using a JavaScript framework, such as React or Angular, you can create a Helper Text for your framework. Depending on your needs, you can use the _Simple Approach: Wrapping MDC Web Vanilla Components_, or the _Advanced Approach: Using Foundations and Adapters_. Please follow the instructions [here](../../../docs/integrating-into-frameworks.md).
+
+### `MDCTextFieldHelperTextAdapter`
+
+Method Signature | Description
+--- | ---
+`addClass(className: string) => void` | Adds a class to the helper text element.
+`removeClass(className: string) => void` | Removes a class from the helper text element.
+`hasClass(className: string) => boolean` | Returns true if classname exists for the helper text element.
+`setAttr(attr: string, value: string) => void` | Sets an attribute with a given value on the helper text element.
+`removeAttr(attr: string) => void` | Removes an attribute on the helper text element.
+`setContent(attr: string) => void` | Sets the text content for the helper text element.
+
+### `MDCTextFieldHelperTextFoundation`
+
+Method Signature | Description
+--- | ---
+`setContent(content: string) => void` | Sets the content of the helper text.
+`setPersistent(isPersistent: boolean) => void` | Sets the helper text as persistent.
+`setValidation(isValidation: boolean) => void` | Sets the helper text as a validation message.
+`showToScreenReader() => void` | Makes the helper text visible to the screen reader.
+`setValidity(inputIsValid: boolean) => void` | Sets the validity of the helper text based on the input validity.
diff --git a/node_modules/@material/textfield/helper-text/_mixins.scss b/node_modules/@material/textfield/helper-text/_mixins.scss
new file mode 100644
index 0000000..4f11718
--- /dev/null
+++ b/node_modules/@material/textfield/helper-text/_mixins.scss
@@ -0,0 +1,43 @@
+//
+// Copyright 2018 Google Inc. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+// Public mixins
+
+@mixin mdc-text-field-helper-text-color($color) {
+  &:not(.mdc-text-field--disabled) {
+    @include mdc-text-field-helper-text-color_($color);
+  }
+}
+
+@mixin mdc-text-field-helper-text-validation-color($color) {
+  &:not(.mdc-text-field--disabled) {
+    @include mdc-text-field-helper-text-validation-color_($color);
+  }
+}
+
+// Private mixins
+
+@mixin mdc-text-field-helper-text-color_($color) {
+  + .mdc-text-field-helper-text {
+    @include mdc-theme-prop(color, $color);
+  }
+}
+
+@mixin mdc-text-field-helper-text-validation-color_($color) {
+  &.mdc-text-field--invalid + .mdc-text-field-helper-text--validation-msg {
+    @include mdc-theme-prop(color, $color);
+  }
+}
diff --git a/node_modules/@material/textfield/helper-text/adapter.js b/node_modules/@material/textfield/helper-text/adapter.js
new file mode 100644
index 0000000..e2072c0
--- /dev/null
+++ b/node_modules/@material/textfield/helper-text/adapter.js
@@ -0,0 +1,70 @@
+/**
+ * @license
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/* eslint no-unused-vars: [2, {"args": "none"}] */
+
+/**
+ * Adapter for MDC Text Field Helper Text.
+ *
+ * Defines the shape of the adapter expected by the foundation. Implement this
+ * adapter to integrate the TextField helper text into your framework. See
+ * https://github.com/material-components/material-components-web/blob/master/docs/authoring-components.md
+ * for more information.
+ *
+ * @record
+ */
+class MDCTextFieldHelperTextAdapter {
+  /**
+   * Adds a class to the helper text element.
+   * @param {string} className
+   */
+  addClass(className) {}
+
+  /**
+   * Removes a class from the helper text element.
+   * @param {string} className
+   */
+  removeClass(className) {}
+
+  /**
+   * Returns whether or not the helper text element contains the given class.
+   * @param {string} className
+   * @return {boolean}
+   */
+  hasClass(className) {}
+
+  /**
+   * Sets an attribute with a given value on the helper text element.
+   * @param {string} attr
+   * @param {string} value
+   */
+  setAttr(attr, value) {}
+
+  /**
+   * Removes an attribute from the helper text element.
+   * @param {string} attr
+   */
+  removeAttr(attr) {}
+
+  /**
+   * Sets the text content for the helper text element.
+   * @param {string} content
+   */
+  setContent(content) {}
+}
+
+export default MDCTextFieldHelperTextAdapter;
diff --git a/node_modules/@material/textfield/helper-text/constants.js b/node_modules/@material/textfield/helper-text/constants.js
new file mode 100644
index 0000000..8fbec6e
--- /dev/null
+++ b/node_modules/@material/textfield/helper-text/constants.js
@@ -0,0 +1,30 @@
+/**
+ * @license
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/** @enum {string} */
+const strings = {
+  ARIA_HIDDEN: 'aria-hidden',
+  ROLE: 'role',
+};
+
+/** @enum {string} */
+const cssClasses = {
+  HELPER_TEXT_PERSISTENT: 'mdc-text-field-helper-text--persistent',
+  HELPER_TEXT_VALIDATION_MSG: 'mdc-text-field-helper-text--validation-msg',
+};
+
+export {strings, cssClasses};
diff --git a/node_modules/@material/textfield/helper-text/foundation.js b/node_modules/@material/textfield/helper-text/foundation.js
new file mode 100644
index 0000000..acc00e1
--- /dev/null
+++ b/node_modules/@material/textfield/helper-text/foundation.js
@@ -0,0 +1,124 @@
+/**
+ * @license
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import MDCFoundation from '@material/base/foundation';
+import MDCTextFieldHelperTextAdapter from './adapter';
+import {cssClasses, strings} from './constants';
+
+
+/**
+ * @extends {MDCFoundation<!MDCTextFieldHelperTextAdapter>}
+ * @final
+ */
+class MDCTextFieldHelperTextFoundation extends MDCFoundation {
+  /** @return enum {string} */
+  static get cssClasses() {
+    return cssClasses;
+  }
+
+  /** @return enum {string} */
+  static get strings() {
+    return strings;
+  }
+
+  /**
+   * {@see MDCTextFieldHelperTextAdapter} for typing information on parameters and return
+   * types.
+   * @return {!MDCTextFieldHelperTextAdapter}
+   */
+  static get defaultAdapter() {
+    return /** @type {!MDCTextFieldHelperTextAdapter} */ ({
+      addClass: () => {},
+      removeClass: () => {},
+      hasClass: () => {},
+      setAttr: () => {},
+      removeAttr: () => {},
+      setContent: () => {},
+    });
+  }
+
+  /**
+   * @param {!MDCTextFieldHelperTextAdapter} adapter
+   */
+  constructor(adapter) {
+    super(Object.assign(MDCTextFieldHelperTextFoundation.defaultAdapter, adapter));
+  }
+
+  /**
+   * Sets the content of the helper text field.
+   * @param {string} content
+   */
+  setContent(content) {
+    this.adapter_.setContent(content);
+  }
+
+  /** @param {boolean} isPersistent Sets the persistency of the helper text. */
+  setPersistent(isPersistent) {
+    if (isPersistent) {
+      this.adapter_.addClass(cssClasses.HELPER_TEXT_PERSISTENT);
+    } else {
+      this.adapter_.removeClass(cssClasses.HELPER_TEXT_PERSISTENT);
+    }
+  }
+
+  /**
+   * @param {boolean} isValidation True to make the helper text act as an
+   *   error validation message.
+   */
+  setValidation(isValidation) {
+    if (isValidation) {
+      this.adapter_.addClass(cssClasses.HELPER_TEXT_VALIDATION_MSG);
+    } else {
+      this.adapter_.removeClass(cssClasses.HELPER_TEXT_VALIDATION_MSG);
+    }
+  }
+
+  /** Makes the helper text visible to the screen reader. */
+  showToScreenReader() {
+    this.adapter_.removeAttr(strings.ARIA_HIDDEN);
+  }
+
+  /**
+   * Sets the validity of the helper text based on the input validity.
+   * @param {boolean} inputIsValid
+   */
+  setValidity(inputIsValid) {
+    const helperTextIsPersistent = this.adapter_.hasClass(cssClasses.HELPER_TEXT_PERSISTENT);
+    const helperTextIsValidationMsg = this.adapter_.hasClass(cssClasses.HELPER_TEXT_VALIDATION_MSG);
+    const validationMsgNeedsDisplay = helperTextIsValidationMsg && !inputIsValid;
+
+    if (validationMsgNeedsDisplay) {
+      this.adapter_.setAttr(strings.ROLE, 'alert');
+    } else {
+      this.adapter_.removeAttr(strings.ROLE);
+    }
+
+    if (!helperTextIsPersistent && !validationMsgNeedsDisplay) {
+      this.hide_();
+    }
+  }
+
+  /**
+   * Hides the help text from screen readers.
+   * @private
+   */
+  hide_() {
+    this.adapter_.setAttr(strings.ARIA_HIDDEN, 'true');
+  }
+}
+
+export default MDCTextFieldHelperTextFoundation;
diff --git a/node_modules/@material/textfield/helper-text/index.js b/node_modules/@material/textfield/helper-text/index.js
new file mode 100644
index 0000000..408f4f2
--- /dev/null
+++ b/node_modules/@material/textfield/helper-text/index.js
@@ -0,0 +1,60 @@
+/**
+ * @license
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import MDCComponent from '@material/base/component';
+
+import MDCTextFieldHelperTextAdapter from './adapter';
+import MDCTextFieldHelperTextFoundation from './foundation';
+
+/**
+ * @extends {MDCComponent<!MDCTextFieldHelperTextFoundation>}
+ * @final
+ */
+class MDCTextFieldHelperText extends MDCComponent {
+  /**
+   * @param {!Element} root
+   * @return {!MDCTextFieldHelperText}
+   */
+  static attachTo(root) {
+    return new MDCTextFieldHelperText(root);
+  }
+
+  /**
+   * @return {!MDCTextFieldHelperTextFoundation}
+   */
+  get foundation() {
+    return this.foundation_;
+  }
+
+  /**
+   * @return {!MDCTextFieldHelperTextFoundation}
+   */
+  getDefaultFoundation() {
+    return new MDCTextFieldHelperTextFoundation(/** @type {!MDCTextFieldHelperTextAdapter} */ (Object.assign({
+      addClass: (className) => this.root_.classList.add(className),
+      removeClass: (className) => this.root_.classList.remove(className),
+      hasClass: (className) => this.root_.classList.contains(className),
+      setAttr: (attr, value) => this.root_.setAttribute(attr, value),
+      removeAttr: (attr) => this.root_.removeAttribute(attr),
+      setContent: (content) => {
+        this.root_.textContent = content;
+      },
+    })));
+  }
+}
+
+export {MDCTextFieldHelperText, MDCTextFieldHelperTextFoundation};
diff --git a/node_modules/@material/textfield/helper-text/mdc-text-field-helper-text.scss b/node_modules/@material/textfield/helper-text/mdc-text-field-helper-text.scss
new file mode 100644
index 0000000..ef0acf7
--- /dev/null
+++ b/node_modules/@material/textfield/helper-text/mdc-text-field-helper-text.scss
@@ -0,0 +1,45 @@
+//
+// Copyright 2017 Google Inc. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+@import "../functions";
+@import "@material/theme/mixins";
+@import "@material/typography/mixins";
+
+// postcss-bem-linter: define text-field-helper-text
+
+.mdc-text-field-helper-text {
+  @include mdc-typography(caption);
+
+  margin: 0;
+  transition: mdc-text-field-transition(opacity);
+  opacity: 0;
+  will-change: opacity;
+
+  // stylelint-disable plugin/selector-bem-pattern
+  .mdc-text-field + & {
+    margin-bottom: 8px;
+  }
+
+  // stylelint-enable plugin/selector-bem-pattern
+}
+
+.mdc-text-field-helper-text--persistent {
+  transition: none;
+  opacity: 1;
+  will-change: initial;
+}
+
+// postcss-bem-linter: end
diff --git a/node_modules/@material/textfield/icon/README.md b/node_modules/@material/textfield/icon/README.md
new file mode 100644
index 0000000..c4411c6
--- /dev/null
+++ b/node_modules/@material/textfield/icon/README.md
@@ -0,0 +1,148 @@
+<!--docs:
+title: "Text Field Icon"
+layout: detail
+section: components
+excerpt: "Icons describe the type of input a text field requires"
+iconId: text_field
+path: /catalog/input-controls/text-field/icon/
+-->
+
+# Text Field Icon
+
+Icons describe the type of input a text field requires. They can also be interaction targets.
+
+## Design & API Documentation
+
+<ul class="icon-list">
+  <li class="icon-list-item icon-list-item--spec">
+    <a href="https://material.io/go/design-text-fields#text-fields-layout">Material Design guidelines: Text Fields Layout</a>
+  </li>
+</ul>
+
+## Basic Usage
+
+### HTML Structure
+
+```html
+<i class="material-icons mdc-text-field__icon" tabindex="0" role="button">event</i>
+```
+
+### Styles
+
+```scss
+@import "@material/textfield/icon/mdc-text-field-icon";
+```
+
+### JavaScript Instantiation
+
+```js
+import {MDCTextFieldIcon} from '@material/textfield/icon';
+
+const icon = new MDCTextFieldIcon(document.querySelector('.mdc-text-field-icon'));
+```
+## Variants
+
+Leading and trailing icons can be applied to text fields styled as `mdc-text-field--box` or `mdc-text-field--outlined`. To add an icon, add the relevant class (either `mdc-text-field--with-leading-icon` or `mdc-text-field--with-trailing-icon`) to the root element, add an `i` element with your preferred icon, and give it a class of `mdc-text-field__icon`.
+
+### Leading icon
+
+In text field box:
+```html
+<div class="mdc-text-field mdc-text-field--box mdc-text-field--with-leading-icon">
+  <i class="material-icons mdc-text-field__icon" tabindex="0" role="button">event</i>
+  <input type="text" id="my-input" class="mdc-text-field__input">
+  <label for="my-input" class="mdc-floating-label">Your Name</label>
+  <div class="mdc-line-ripple"></div>
+</div>
+```
+
+In outlined text field:
+```html
+<div class="mdc-text-field mdc-text-field--outlined mdc-text-field--with-leading-icon">
+  <i class="material-icons mdc-text-field__icon" tabindex="0" role="button">event</i>
+  <input type="text" id="my-input" class="mdc-text-field__input">
+  <label for="my-input" class="mdc-floating-label">Your Name</label>
+  <div class="mdc-notched-outline">
+    <svg>
+      <path class="mdc-notched-outline__path"/>
+    </svg>
+  </div>
+  <div class="mdc-notched-outline__idle"></div>
+</div>
+```
+
+### Trailing icon
+
+In text field box:
+```html
+<div class="mdc-text-field mdc-text-field--box mdc-text-field--with-trailing-icon">
+  <input type="text" id="my-input" class="mdc-text-field__input">
+  <label for="my-input" class="mdc-floating-label">Your Name</label>
+  <i class="material-icons mdc-text-field__icon" tabindex="0" role="button">event</i>
+  <div class="mdc-line-ripple"></div>
+</div>
+```
+
+In outlined text field:
+```html
+<div class="mdc-text-field mdc-text-field--outlined mdc-text-field--with-trailing-icon">
+  <input type="text" id="my-input" class="mdc-text-field__input">
+  <label for="my-input" class="mdc-floating-label">Your Name</label>
+  <i class="material-icons mdc-text-field__icon" tabindex="0" role="button">event</i>
+  <div class="mdc-notched-outline">
+    <svg>
+      <path class="mdc-notched-outline__path"/>
+    </svg>
+  </div>
+  <div class="mdc-notched-outline__idle"></div>
+</div>
+```
+
+>**NOTE:** if you would like to display un-clickable icons, simply remove `tabindex="0"` and `role="button"`,
+and the CSS will ensure the cursor is set to default, and that interacting with an icon doesn't
+do anything unexpected.
+
+## Style Customization
+
+### CSS Classes
+
+CSS Class | Description
+--- | ---
+`mdc-text-field-icon` | Mandatory.
+
+### Sass Mixins
+
+Mixin | Description
+--- | ---
+`mdc-text-field-icon-color($color)` | Customizes the color for the leading/trailing icons.
+
+## `MDCTextFieldIcon` Properties and Methods
+
+Property | Value Type | Description
+--- | --- | ---
+`foundation` | `MDCTextFieldIconFoundation` | Returns the icon's foundation. This allows the parent `MDCTextField` component to access the public methods on the `MDCTextFieldIconFoundation` class.
+
+## Usage Within Frameworks
+
+If you are using a JavaScript framework, such as React or Angular, you can create a Text Field Icon for your framework. Depending on your needs, you can use the _Simple Approach: Wrapping MDC Web Vanilla Components_, or the _Advanced Approach: Using Foundations and Adapters_. Please follow the instructions [here](../../../docs/integrating-into-frameworks.md).
+
+### `MDCTextFieldIconAdapter`
+
+Method Signature | Description
+--- | ---
+`getAttr(attr: string) => string` | Gets the value of an attribute on the icon element.
+`setAttr(attr: string, value: string) => void` | Sets an attribute with a given value on the icon element.
+`removeAttr(attr: string) => void` | Removes an attribute from the icon element.
+`setContent(content: string) => void` | Sets the text content of the icon element.
+`registerInteractionHandler(evtType: string, handler: EventListener) => void` | Registers an event listener for a given event.
+`deregisterInteractionHandler(evtType: string, handler: EventListener) => void` | Deregisters an event listener for a given event.
+`notifyIconAction() => void` | Emits a custom event "MDCTextField:icon" denoting a user has clicked the icon, which bubbles to the top-level text field element.
+
+### `MDCTextFieldIconFoundation`
+
+Method Signature | Description
+--- | ---
+`setDisabled(disabled: boolean) => void` | Updates the icon's disabled state.
+`setAriaLabel(label: string) => void` | Updates the icon's aria-label.
+`setContent(content: string) => void` | Updates the icon's text content.
+`handleInteraction(evt: Event) => void` | Handles a text field interaction event.
diff --git a/node_modules/@material/textfield/icon/_mixins.scss b/node_modules/@material/textfield/icon/_mixins.scss
new file mode 100644
index 0000000..f31e5f9
--- /dev/null
+++ b/node_modules/@material/textfield/icon/_mixins.scss
@@ -0,0 +1,56 @@
+//
+// Copyright 2018 Google Inc. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+// Public mixins
+
+@mixin mdc-text-field-icon-color($color) {
+  &:not(.mdc-text-field--disabled) {
+    @include mdc-text-field-icon-color_($color);
+  }
+}
+
+// Private mixins
+
+@mixin mdc-text-field-icon-horizontal-position_($position-property, $position, $padding) {
+  .mdc-text-field__icon {
+    @include mdc-rtl-reflexive-position($position-property, $position);
+  }
+
+  // Move the input's position, to allow room for the icon
+  @if ($position-property == left) {
+    .mdc-text-field__input {
+      @include mdc-rtl-reflexive-property(padding, $padding /* left-value */, $position  /* right-value */);
+    }
+  } @else {
+    .mdc-text-field__input {
+      @include mdc-rtl-reflexive-property(padding, $position /* left-value */, $padding  /* right-value */);
+    }
+  }
+
+  // Only move the label's position to allow room for the icon, if the icon is on the same
+  // side as the label. Aka the icon is on left side in a LTR context.
+  @if ($position-property == left) {
+    .mdc-floating-label {
+      @include mdc-rtl-reflexive-position($position-property, $padding);
+    }
+  }
+}
+
+@mixin mdc-text-field-icon-color_($color) {
+  .mdc-text-field__icon {
+    @include mdc-theme-prop(color, $color);
+  }
+}
diff --git a/node_modules/@material/textfield/icon/_variables.scss b/node_modules/@material/textfield/icon/_variables.scss
new file mode 100644
index 0000000..e540972
--- /dev/null
+++ b/node_modules/@material/textfield/icon/_variables.scss
@@ -0,0 +1,20 @@
+//
+// Copyright 2018 Google Inc. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+$mdc-text-field-icon-position: 15px;
+$mdc-text-field-icon-padding: 48px;
+$mdc-text-field-dense-icon-position: 12px;
+$mdc-text-field-dense-icon-padding: 38px;
diff --git a/node_modules/@material/textfield/icon/adapter.js b/node_modules/@material/textfield/icon/adapter.js
new file mode 100644
index 0000000..fd3467f
--- /dev/null
+++ b/node_modules/@material/textfield/icon/adapter.js
@@ -0,0 +1,77 @@
+/**
+ * @license
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/* eslint no-unused-vars: [2, {"args": "none"}] */
+
+/**
+ * Adapter for MDC Text Field Icon.
+ *
+ * Defines the shape of the adapter expected by the foundation. Implement this
+ * adapter to integrate the text field icon into your framework. See
+ * https://github.com/material-components/material-components-web/blob/master/docs/authoring-components.md
+ * for more information.
+ *
+ * @record
+ */
+class MDCTextFieldIconAdapter {
+  /**
+   * Gets the value of an attribute on the icon element.
+   * @param {string} attr
+   * @return {string}
+   */
+  getAttr(attr) {}
+
+  /**
+   * Sets an attribute on the icon element.
+   * @param {string} attr
+   * @param {string} value
+   */
+  setAttr(attr, value) {}
+
+  /**
+   * Removes an attribute from the icon element.
+   * @param {string} attr
+   */
+  removeAttr(attr) {}
+
+  /**
+   * Sets the text content of the icon element.
+   * @param {string} content
+   */
+  setContent(content) {}
+
+  /**
+   * Registers an event listener on the icon element for a given event.
+   * @param {string} evtType
+   * @param {function(!Event): undefined} handler
+   */
+  registerInteractionHandler(evtType, handler) {}
+
+  /**
+   * Deregisters an event listener on the icon element for a given event.
+   * @param {string} evtType
+   * @param {function(!Event): undefined} handler
+   */
+  deregisterInteractionHandler(evtType, handler) {}
+
+  /**
+   * Emits a custom event "MDCTextField:icon" denoting a user has clicked the icon.
+   */
+  notifyIconAction() {}
+}
+
+export default MDCTextFieldIconAdapter;
diff --git a/node_modules/@material/textfield/icon/constants.js b/node_modules/@material/textfield/icon/constants.js
new file mode 100644
index 0000000..c414005
--- /dev/null
+++ b/node_modules/@material/textfield/icon/constants.js
@@ -0,0 +1,24 @@
+/**
+ * @license
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/** @enum {string} */
+const strings = {
+  ICON_EVENT: 'MDCTextField:icon',
+  ICON_ROLE: 'button',
+};
+
+export {strings};
diff --git a/node_modules/@material/textfield/icon/foundation.js b/node_modules/@material/textfield/icon/foundation.js
new file mode 100644
index 0000000..4b47bc8
--- /dev/null
+++ b/node_modules/@material/textfield/icon/foundation.js
@@ -0,0 +1,113 @@
+/**
+ * @license
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import MDCFoundation from '@material/base/foundation';
+import MDCTextFieldIconAdapter from './adapter';
+import {strings} from './constants';
+
+
+/**
+ * @extends {MDCFoundation<!MDCTextFieldIconAdapter>}
+ * @final
+ */
+class MDCTextFieldIconFoundation extends MDCFoundation {
+  /** @return enum {string} */
+  static get strings() {
+    return strings;
+  }
+
+  /**
+   * {@see MDCTextFieldIconAdapter} for typing information on parameters and return
+   * types.
+   * @return {!MDCTextFieldIconAdapter}
+   */
+  static get defaultAdapter() {
+    return /** @type {!MDCTextFieldIconAdapter} */ ({
+      getAttr: () => {},
+      setAttr: () => {},
+      removeAttr: () => {},
+      setContent: () => {},
+      registerInteractionHandler: () => {},
+      deregisterInteractionHandler: () => {},
+      notifyIconAction: () => {},
+    });
+  }
+
+  /**
+   * @param {!MDCTextFieldIconAdapter} adapter
+   */
+  constructor(adapter) {
+    super(Object.assign(MDCTextFieldIconFoundation.defaultAdapter, adapter));
+
+    /** @private {string?} */
+    this.savedTabIndex_ = null;
+
+    /** @private {function(!Event): undefined} */
+    this.interactionHandler_ = (evt) => this.handleInteraction(evt);
+  }
+
+  init() {
+    this.savedTabIndex_ = this.adapter_.getAttr('tabindex');
+
+    ['click', 'keydown'].forEach((evtType) => {
+      this.adapter_.registerInteractionHandler(evtType, this.interactionHandler_);
+    });
+  }
+
+  destroy() {
+    ['click', 'keydown'].forEach((evtType) => {
+      this.adapter_.deregisterInteractionHandler(evtType, this.interactionHandler_);
+    });
+  }
+
+  /** @param {boolean} disabled */
+  setDisabled(disabled) {
+    if (!this.savedTabIndex_) {
+      return;
+    }
+
+    if (disabled) {
+      this.adapter_.setAttr('tabindex', '-1');
+      this.adapter_.removeAttr('role');
+    } else {
+      this.adapter_.setAttr('tabindex', this.savedTabIndex_);
+      this.adapter_.setAttr('role', strings.ICON_ROLE);
+    }
+  }
+
+  /** @param {string} label */
+  setAriaLabel(label) {
+    this.adapter_.setAttr('aria-label', label);
+  }
+
+  /** @param {string} content */
+  setContent(content) {
+    this.adapter_.setContent(content);
+  }
+
+  /**
+   * Handles an interaction event
+   * @param {!Event} evt
+   */
+  handleInteraction(evt) {
+    if (evt.type === 'click' || evt.key === 'Enter' || evt.keyCode === 13) {
+      this.adapter_.notifyIconAction();
+    }
+  }
+}
+
+export default MDCTextFieldIconFoundation;
diff --git a/node_modules/@material/textfield/icon/index.js b/node_modules/@material/textfield/icon/index.js
new file mode 100644
index 0000000..33f7aaf
--- /dev/null
+++ b/node_modules/@material/textfield/icon/index.js
@@ -0,0 +1,62 @@
+/**
+ * @license
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import MDCComponent from '@material/base/component';
+
+import MDCTextFieldIconAdapter from './adapter';
+import MDCTextFieldIconFoundation from './foundation';
+
+/**
+ * @extends {MDCComponent<!MDCTextFieldIconFoundation>}
+ * @final
+ */
+class MDCTextFieldIcon extends MDCComponent {
+  /**
+   * @param {!Element} root
+   * @return {!MDCTextFieldIcon}
+   */
+  static attachTo(root) {
+    return new MDCTextFieldIcon(root);
+  }
+
+  /**
+   * @return {!MDCTextFieldIconFoundation}
+   */
+  get foundation() {
+    return this.foundation_;
+  }
+
+  /**
+   * @return {!MDCTextFieldIconFoundation}
+   */
+  getDefaultFoundation() {
+    return new MDCTextFieldIconFoundation(/** @type {!MDCTextFieldIconAdapter} */ (Object.assign({
+      getAttr: (attr) => this.root_.getAttribute(attr),
+      setAttr: (attr, value) => this.root_.setAttribute(attr, value),
+      removeAttr: (attr) => this.root_.removeAttribute(attr),
+      setContent: (content) => {
+        this.root_.textContent = content;
+      },
+      registerInteractionHandler: (evtType, handler) => this.root_.addEventListener(evtType, handler),
+      deregisterInteractionHandler: (evtType, handler) => this.root_.removeEventListener(evtType, handler),
+      notifyIconAction: () => this.emit(
+        MDCTextFieldIconFoundation.strings.ICON_EVENT, {} /* evtData */, true /* shouldBubble */),
+    })));
+  }
+}
+
+export {MDCTextFieldIcon, MDCTextFieldIconFoundation};
diff --git a/node_modules/@material/textfield/icon/mdc-text-field-icon.scss b/node_modules/@material/textfield/icon/mdc-text-field-icon.scss
new file mode 100644
index 0000000..42ce1e6
--- /dev/null
+++ b/node_modules/@material/textfield/icon/mdc-text-field-icon.scss
@@ -0,0 +1,31 @@
+//
+// Copyright 2017 Google Inc. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+@import "@material/theme/variables";
+@import "@material/theme/mixins";
+
+.mdc-text-field--with-leading-icon .mdc-text-field__icon,
+.mdc-text-field--with-trailing-icon .mdc-text-field__icon {
+  position: absolute;
+  bottom: 16px;
+  cursor: pointer;
+}
+
+.mdc-text-field__icon:not([tabindex]),
+.mdc-text-field__icon[tabindex="-1"] {
+  cursor: default;
+  pointer-events: none;
+}
diff --git a/node_modules/@material/textfield/index.js b/node_modules/@material/textfield/index.js
new file mode 100644
index 0000000..6de2aad
--- /dev/null
+++ b/node_modules/@material/textfield/index.js
@@ -0,0 +1,455 @@
+/**
+ * @license
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import MDCComponent from '@material/base/component';
+/* eslint-disable no-unused-vars */
+import {MDCRipple, MDCRippleFoundation, RippleCapableSurface} from '@material/ripple/index';
+/* eslint-enable no-unused-vars */
+import {getMatchesProperty} from '@material/ripple/util';
+
+
+import {cssClasses, strings} from './constants';
+import {MDCTextFieldAdapter, FoundationMapType} from './adapter';
+import MDCTextFieldFoundation from './foundation';
+/* eslint-disable no-unused-vars */
+import {MDCLineRipple, MDCLineRippleFoundation} from '@material/line-ripple/index';
+import {MDCTextFieldHelperText, MDCTextFieldHelperTextFoundation} from './helper-text/index';
+import {MDCTextFieldIcon, MDCTextFieldIconFoundation} from './icon/index';
+import {MDCFloatingLabel, MDCFloatingLabelFoundation} from '@material/floating-label/index';
+import {MDCNotchedOutline, MDCNotchedOutlineFoundation} from '@material/notched-outline/index';
+/* eslint-enable no-unused-vars */
+
+/**
+ * @extends {MDCComponent<!MDCTextFieldFoundation>}
+ * @final
+ */
+class MDCTextField extends MDCComponent {
+  /**
+   * @param {...?} args
+   */
+  constructor(...args) {
+    super(...args);
+    /** @private {?Element} */
+    this.input_;
+    /** @type {?MDCRipple} */
+    this.ripple;
+    /** @private {?MDCLineRipple} */
+    this.lineRipple_;
+    /** @private {?MDCTextFieldHelperText} */
+    this.helperText_;
+    /** @private {?MDCTextFieldIcon} */
+    this.icon_;
+    /** @private {?MDCFloatingLabel} */
+    this.label_;
+    /** @private {?MDCNotchedOutline} */
+    this.outline_;
+  }
+
+  /**
+   * @param {!Element} root
+   * @return {!MDCTextField}
+   */
+  static attachTo(root) {
+    return new MDCTextField(root);
+  }
+
+  /**
+   * @param {(function(!Element): !MDCRipple)=} rippleFactory A function which
+   * creates a new MDCRipple.
+   * @param {(function(!Element): !MDCLineRipple)=} lineRippleFactory A function which
+   * creates a new MDCLineRipple.
+   * @param {(function(!Element): !MDCTextFieldHelperText)=} helperTextFactory A function which
+   * creates a new MDCTextFieldHelperText.
+   * @param {(function(!Element): !MDCTextFieldIcon)=} iconFactory A function which
+   * creates a new MDCTextFieldIcon.
+   * @param {(function(!Element): !MDCFloatingLabel)=} labelFactory A function which
+   * creates a new MDCFloatingLabel.
+   * @param {(function(!Element): !MDCNotchedOutline)=} outlineFactory A function which
+   * creates a new MDCNotchedOutline.
+   */
+  initialize(
+    rippleFactory = (el, foundation) => new MDCRipple(el, foundation),
+    lineRippleFactory = (el) => new MDCLineRipple(el),
+    helperTextFactory = (el) => new MDCTextFieldHelperText(el),
+    iconFactory = (el) => new MDCTextFieldIcon(el),
+    labelFactory = (el) => new MDCFloatingLabel(el),
+    outlineFactory = (el) => new MDCNotchedOutline(el)) {
+    this.input_ = this.root_.querySelector(strings.INPUT_SELECTOR);
+    const labelElement = this.root_.querySelector(strings.LABEL_SELECTOR);
+    if (labelElement) {
+      this.label_ = labelFactory(labelElement);
+    }
+    const lineRippleElement = this.root_.querySelector(strings.LINE_RIPPLE_SELECTOR);
+    if (lineRippleElement) {
+      this.lineRipple_ = lineRippleFactory(lineRippleElement);
+    }
+    const outlineElement = this.root_.querySelector(strings.OUTLINE_SELECTOR);
+    if (outlineElement) {
+      this.outline_ = outlineFactory(outlineElement);
+    }
+    if (this.input_.hasAttribute(strings.ARIA_CONTROLS)) {
+      const helperTextElement = document.getElementById(this.input_.getAttribute(strings.ARIA_CONTROLS));
+      if (helperTextElement) {
+        this.helperText_ = helperTextFactory(helperTextElement);
+      }
+    }
+    const iconElement = this.root_.querySelector(strings.ICON_SELECTOR);
+    if (iconElement) {
+      this.icon_ = iconFactory(iconElement);
+    }
+
+    this.ripple = null;
+    if (this.root_.classList.contains(cssClasses.BOX)) {
+      const MATCHES = getMatchesProperty(HTMLElement.prototype);
+      const adapter =
+        Object.assign(MDCRipple.createAdapter(/** @type {!RippleCapableSurface} */ (this)), {
+          isSurfaceActive: () => this.input_[MATCHES](':active'),
+          registerInteractionHandler: (type, handler) => this.input_.addEventListener(type, handler),
+          deregisterInteractionHandler: (type, handler) => this.input_.removeEventListener(type, handler),
+        });
+      const foundation = new MDCRippleFoundation(adapter);
+      this.ripple = rippleFactory(this.root_, foundation);
+    }
+  }
+
+  destroy() {
+    if (this.ripple) {
+      this.ripple.destroy();
+    }
+    if (this.lineRipple_) {
+      this.lineRipple_.destroy();
+    }
+    if (this.helperText_) {
+      this.helperText_.destroy();
+    }
+    if (this.icon_) {
+      this.icon_.destroy();
+    }
+    if (this.label_) {
+      this.label_.destroy();
+    }
+    if (this.outline_) {
+      this.outline_.destroy();
+    }
+    super.destroy();
+  }
+
+  /**
+   * Initiliazes the Text Field's internal state based on the environment's
+   * state.
+   */
+  initialSyncWithDom() {
+    this.disabled = this.input_.disabled;
+  }
+
+  /**
+   * @return {string} The value of the input.
+   */
+  get value() {
+    return this.foundation_.getValue();
+  }
+
+  /**
+   * @param {string} value The value to set on the input.
+   */
+  set value(value) {
+    this.foundation_.setValue(value);
+  }
+
+  /**
+   * @return {boolean} True if the Text Field is disabled.
+   */
+  get disabled() {
+    return this.foundation_.isDisabled();
+  }
+
+  /**
+   * @param {boolean} disabled Sets the Text Field disabled or enabled.
+   */
+  set disabled(disabled) {
+    this.foundation_.setDisabled(disabled);
+  }
+
+  /**
+   * @return {boolean} valid True if the Text Field is valid.
+   */
+  get valid() {
+    return this.foundation_.isValid();
+  }
+
+  /**
+   * @param {boolean} valid Sets the Text Field valid or invalid.
+   */
+  set valid(valid) {
+    this.foundation_.setValid(valid);
+  }
+
+  /**
+   * @return {boolean} True if the Text Field is required.
+   */
+  get required() {
+    return this.input_.required;
+  }
+
+  /**
+   * @param {boolean} required Sets the Text Field to required.
+   */
+  set required(required) {
+    this.input_.required = required;
+  }
+
+  /**
+   * @return {string} The input element's validation pattern.
+   */
+  get pattern() {
+    return this.input_.pattern;
+  }
+
+  /**
+   * @param {string} pattern Sets the input element's validation pattern.
+   */
+  set pattern(pattern) {
+    this.input_.pattern = pattern;
+  }
+
+  /**
+   * @return {number} The input element's minLength.
+   */
+  get minLength() {
+    return this.input_.minLength;
+  }
+
+  /**
+   * @param {number} minLength Sets the input element's minLength.
+   */
+  set minLength(minLength) {
+    this.input_.minLength = minLength;
+  }
+
+  /**
+   * @return {number} The input element's maxLength.
+   */
+  get maxLength() {
+    return this.input_.maxLength;
+  }
+
+  /**
+   * @param {number} maxLength Sets the input element's maxLength.
+   */
+  set maxLength(maxLength) {
+    // Chrome throws exception if maxLength is set < 0
+    if (maxLength < 0) {
+      this.input_.removeAttribute('maxLength');
+    } else {
+      this.input_.maxLength = maxLength;
+    }
+  }
+
+  /**
+   * @return {string} The input element's min.
+   */
+  get min() {
+    return this.input_.min;
+  }
+
+  /**
+   * @param {string} min Sets the input element's min.
+   */
+  set min(min) {
+    this.input_.min = min;
+  }
+
+  /**
+   * @return {string} The input element's max.
+   */
+  get max() {
+    return this.input_.max;
+  }
+
+  /**
+   * @param {string} max Sets the input element's max.
+   */
+  set max(max) {
+    this.input_.max = max;
+  }
+
+  /**
+   * @return {string} The input element's step.
+   */
+  get step() {
+    return this.input_.step;
+  }
+
+  /**
+   * @param {string} step Sets the input element's step.
+   */
+  set step(step) {
+    this.input_.step = step;
+  }
+
+  /**
+   * Sets the helper text element content.
+   * @param {string} content
+   */
+  set helperTextContent(content) {
+    this.foundation_.setHelperTextContent(content);
+  }
+
+  /**
+   * Sets the aria label of the icon.
+   * @param {string} label
+   */
+  set iconAriaLabel(label) {
+    this.foundation_.setIconAriaLabel(label);
+  }
+
+  /**
+   * Sets the text content of the icon.
+   * @param {string} content
+   */
+  set iconContent(content) {
+    this.foundation_.setIconContent(content);
+  }
+
+  /**
+   * Recomputes the outline SVG path for the outline element.
+   */
+  layout() {
+    const openNotch = this.foundation_.shouldFloat;
+    this.foundation_.notchOutline(openNotch);
+  }
+
+  /**
+   * @return {!MDCTextFieldFoundation}
+   */
+  getDefaultFoundation() {
+    return new MDCTextFieldFoundation(
+      /** @type {!MDCTextFieldAdapter} */ (Object.assign({
+        addClass: (className) => this.root_.classList.add(className),
+        removeClass: (className) => this.root_.classList.remove(className),
+        hasClass: (className) => this.root_.classList.contains(className),
+        registerTextFieldInteractionHandler: (evtType, handler) => this.root_.addEventListener(evtType, handler),
+        deregisterTextFieldInteractionHandler: (evtType, handler) => this.root_.removeEventListener(evtType, handler),
+        registerValidationAttributeChangeHandler: (handler) => {
+          const getAttributesList = (mutationsList) => mutationsList.map((mutation) => mutation.attributeName);
+          const observer = new MutationObserver((mutationsList) => handler(getAttributesList(mutationsList)));
+          const targetNode = this.root_.querySelector(strings.INPUT_SELECTOR);
+          const config = {attributes: true};
+          observer.observe(targetNode, config);
+          return observer;
+        },
+        deregisterValidationAttributeChangeHandler: (observer) => observer.disconnect(),
+        isFocused: () => {
+          return document.activeElement === this.root_.querySelector(strings.INPUT_SELECTOR);
+        },
+        isRtl: () => window.getComputedStyle(this.root_).getPropertyValue('direction') === 'rtl',
+      },
+      this.getInputAdapterMethods_(),
+      this.getLabelAdapterMethods_(),
+      this.getLineRippleAdapterMethods_(),
+      this.getOutlineAdapterMethods_())),
+      this.getFoundationMap_());
+  }
+
+  /**
+   * @return {!{
+   *   shakeLabel: function(boolean): undefined,
+   *   floatLabel: function(boolean): undefined,
+   *   hasLabel: function(): boolean,
+   *   getLabelWidth: function(): number,
+   * }}
+   */
+  getLabelAdapterMethods_() {
+    return {
+      shakeLabel: (shouldShake) => this.label_.shake(shouldShake),
+      floatLabel: (shouldFloat) => this.label_.float(shouldFloat),
+      hasLabel: () => !!this.label_,
+      getLabelWidth: () => this.label_.getWidth(),
+    };
+  }
+
+  /**
+   * @return {!{
+   *   activateLineRipple: function(): undefined,
+   *   deactivateLineRipple: function(): undefined,
+   *   setLineRippleTransformOrigin: function(number): undefined,
+   * }}
+   */
+  getLineRippleAdapterMethods_() {
+    return {
+      activateLineRipple: () => {
+        if (this.lineRipple_) {
+          this.lineRipple_.activate();
+        }
+      },
+      deactivateLineRipple: () => {
+        if (this.lineRipple_) {
+          this.lineRipple_.deactivate();
+        }
+      },
+      setLineRippleTransformOrigin: (normalizedX) => {
+        if (this.lineRipple_) {
+          this.lineRipple_.setRippleCenter(normalizedX);
+        }
+      },
+    };
+  }
+
+  /**
+   * @return {!{
+   *   notchOutline: function(number, boolean): undefined,
+   *   hasOutline: function(): boolean,
+   * }}
+   */
+  getOutlineAdapterMethods_() {
+    return {
+      notchOutline: (labelWidth, isRtl) => this.outline_.notch(labelWidth, isRtl),
+      closeOutline: () => this.outline_.closeNotch(),
+      hasOutline: () => !!this.outline_,
+    };
+  }
+
+  /**
+   * @return {!{
+   *   registerInputInteractionHandler: function(string, function()): undefined,
+   *   deregisterInputInteractionHandler: function(string, function()): undefined,
+   *   getNativeInput: function(): ?Element,
+   * }}
+   */
+  getInputAdapterMethods_() {
+    return {
+      registerInputInteractionHandler: (evtType, handler) => this.input_.addEventListener(evtType, handler),
+      deregisterInputInteractionHandler: (evtType, handler) => this.input_.removeEventListener(evtType, handler),
+      getNativeInput: () => this.input_,
+    };
+  }
+
+  /**
+   * Returns a map of all subcomponents to subfoundations.
+   * @return {!FoundationMapType}
+   */
+  getFoundationMap_() {
+    return {
+      helperText: this.helperText_ ? this.helperText_.foundation : undefined,
+      icon: this.icon_ ? this.icon_.foundation : undefined,
+    };
+  }
+}
+
+export {MDCTextField, MDCTextFieldFoundation,
+  MDCTextFieldHelperText, MDCTextFieldHelperTextFoundation,
+  MDCTextFieldIcon, MDCTextFieldIconFoundation};
diff --git a/node_modules/@material/textfield/mdc-text-field.scss b/node_modules/@material/textfield/mdc-text-field.scss
new file mode 100644
index 0000000..15fc1bc
--- /dev/null
+++ b/node_modules/@material/textfield/mdc-text-field.scss
@@ -0,0 +1,245 @@
+//
+// Copyright 2017 Google Inc. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+@import "@material/animation/variables";
+@import "@material/floating-label/mdc-floating-label";
+@import "@material/line-ripple/mdc-line-ripple";
+@import "@material/notched-outline/mdc-notched-outline";
+@import "@material/ripple/common";
+@import "@material/ripple/mixins";
+@import "@material/rtl/mixins";
+@import "@material/theme/variables";
+@import "@material/typography/mixins";
+@import "@material/typography/variables";
+@import "./functions";
+@import "./helper-text/mdc-text-field-helper-text";
+@import "./icon/mdc-text-field-icon";
+@import "./mixins";
+@import "./variables";
+
+// postcss-bem-linter: define text-field
+
+.mdc-text-field {
+  @include mdc-text-field-bottom-line-color($mdc-text-field-bottom-line-idle);
+  @include mdc-text-field-hover-bottom-line-color($mdc-text-field-bottom-line-hover);
+  @include mdc-text-field-line-ripple-color_(primary);
+  @include mdc-text-field-ink-color($mdc-text-field-ink-color);
+  @include mdc-text-field-label-color($mdc-text-field-label);
+  @include mdc-text-field-helper-text-color($mdc-text-field-helper-text-color);
+  @include mdc-text-field-fullwidth-bottom-line-color($mdc-text-field-fullwidth-bottom-line-color);
+  @include mdc-text-field-icon-color($mdc-text-field-icon-color);
+  @include mdc-text-field-caret-color(primary);
+
+  display: inline-block;
+  position: relative;
+  margin-bottom: 8px;
+  will-change: opacity, transform, color;
+}
+
+.mdc-text-field__input {
+  @include mdc-typography(subtitle1);
+
+  width: 100%;
+  height: 30px;
+  padding: 20px 0 1px;
+  transition: mdc-text-field-transition(opacity);
+  border: none;
+  border-bottom: 1px solid;
+  border-radius: 0;
+  background: none;
+  appearance: none;
+
+  &::placeholder {
+    transition: mdc-text-field-transition(color);
+    opacity: 1;
+  }
+
+  &:focus {
+    outline: none;
+  }
+
+  // Remove red outline on firefox
+  &:invalid {
+    box-shadow: none;
+  }
+
+  // Move label when text-field gets autofilled in Chrome
+  // stylelint-disable plugin/selector-bem-pattern
+  &:-webkit-autofill + .mdc-floating-label {
+    transform: translateY(-100%) scale(.75);
+    cursor: auto;
+  }
+  // stylelint-enable plugin/selector-bem-pattern
+}
+
+.mdc-text-field--outlined {
+  @include mdc-text-field-outlined_;
+}
+
+.mdc-text-field--outlined.mdc-text-field--focused {
+  @include mdc-text-field-outlined-focused_;
+}
+
+.mdc-text-field--outlined.mdc-text-field--disabled {
+  @include mdc-text-field-outlined-disabled_;
+}
+
+.mdc-text-field--outlined.mdc-text-field--dense {
+  @include mdc-text-field-outlined-dense_;
+}
+
+.mdc-text-field--box {
+  @include mdc-text-field-box_;
+}
+
+.mdc-text-field--box.mdc-text-field--disabled {
+  @include mdc-text-field-box-disabled_;
+}
+
+.mdc-text-field--box.mdc-text-field--dense {
+  @include mdc-text-field-box-dense_;
+}
+
+.mdc-text-field--with-leading-icon {
+  @include mdc-text-field-with-leading-icon_;
+}
+
+.mdc-text-field--with-leading-icon.mdc-text-field--outlined {
+  @include mdc-text-field-outlined-with-leading-icon_;
+}
+
+.mdc-text-field--with-leading-icon.mdc-text-field--outlined.mdc-text-field--dense {
+  @include mdc-text-field-outlined-dense-with-leading-icon_;
+}
+
+.mdc-text-field--with-trailing-icon {
+  @include mdc-text-field-with-trailing-icon_;
+}
+
+// stylelint-disable plugin/selector-bem-pattern
+.mdc-text-field--with-leading-icon.mdc-text-field--dense .mdc-text-field__icon,
+.mdc-text-field--with-trailing-icon.mdc-text-field--dense .mdc-text-field__icon {
+  bottom: 16px;
+  transform: scale(.8);
+}
+// stylelint-enable plugin/selector-bem-pattern
+
+.mdc-text-field--with-leading-icon.mdc-text-field--dense {
+  @include mdc-text-field-dense-with-leading-icon_;
+}
+
+.mdc-text-field--with-trailing-icon.mdc-text-field--dense {
+  @include mdc-text-field-dense-with-trailing-icon_;
+}
+
+.mdc-text-field--upgraded:not(.mdc-text-field--fullwidth):not(.mdc-text-field--box) {
+  display: inline-flex;
+  position: relative;
+  align-items: flex-end;
+  box-sizing: border-box;
+  margin-top: 16px;
+
+  // stylelint-disable-next-line selector-max-specificity
+  &:not(.mdc-text-field--textarea):not(.mdc-text-field--outlined) {
+    height: 48px;
+  }
+}
+
+.mdc-text-field--dense {
+  @include mdc-text-field-dense_;
+}
+
+@include mdc-required-text-field-label-asterisk_ {
+  margin-left: 1px;
+  content: "*";
+}
+
+.mdc-text-field--textarea {
+  @include mdc-text-field-textarea_;
+}
+
+.mdc-text-field--fullwidth {
+  @include mdc-text-field-fullwidth_;
+}
+
+.mdc-text-field--fullwidth.mdc-text-field--invalid {
+  @include mdc-text-field-fullwidth-invalid_;
+}
+
+// postcss-bem-linter: define text-field-helper-text
+
+.mdc-text-field-helper-text {
+  // stylelint-disable plugin/selector-bem-pattern
+  .mdc-text-field--dense + & {
+    margin-bottom: 4px;
+  }
+
+  .mdc-text-field--box + &,
+  .mdc-text-field--outlined + &,
+  .mdc-text-field--textarea + & {
+    margin-right: 16px;
+    margin-left: 16px;
+  }
+
+  // stylelint-enable plugin/selector-bem-pattern
+}
+
+// postcss-bem-linter: end
+
+// mdc-form-field tweaks to align text field label correctly
+// stylelint-disable selector-max-type
+.mdc-form-field > .mdc-text-field + label {
+  align-self: flex-start;
+}
+// stylelint-enable selector-max-type
+
+.mdc-text-field--focused {
+  @include mdc-text-field-focused_;
+}
+
+.mdc-text-field--textarea.mdc-text-field--focused {
+  @include mdc-text-field-textarea-stroke-color(primary);
+}
+
+.mdc-text-field--invalid {
+  @include mdc-text-field-invalid_;
+}
+
+.mdc-text-field--textarea.mdc-text-field--invalid {
+  @include mdc-text-field-textarea-invalid_;
+}
+
+.mdc-text-field--outlined.mdc-text-field--invalid {
+  @include mdc-text-field-outlined-invalid_;
+}
+
+.mdc-text-field--disabled {
+  @include mdc-text-field-disabled_;
+}
+
+.mdc-text-field--textarea.mdc-text-field--disabled {
+  @include mdc-text-field-textarea-disabled_;
+}
+
+@include mdc-floating-label-shake-keyframes(text-field-box, $mdc-text-field-box-label-position-y);
+@include mdc-floating-label-shake-keyframes(text-field-box-dense, $mdc-text-field-box-dense-label-position-y, 0%, $mdc-text-field-dense-label-scale);
+@include mdc-floating-label-shake-keyframes(text-field-outlined, $mdc-text-field-outlined-label-position-y);
+@include mdc-floating-label-shake-keyframes(text-field-outlined-dense, $mdc-text-field-outlined-dense-label-position-y, 0%, $mdc-text-field-dense-label-scale);
+@include mdc-floating-label-shake-keyframes(text-field-outlined-leading-icon, $mdc-text-field-outlined-label-position-y, $mdc-text-field-outlined-with-leading-icon-label-position-x);
+@include mdc-floating-label-shake-keyframes(text-field-outlined-leading-icon-dense, $mdc-text-field-outlined-dense-label-position-y, $mdc-text-field-outlined-dense-with-leading-icon-label-position-x, $mdc-text-field-dense-label-scale);
+@include mdc-floating-label-shake-keyframes(text-field-outlined-leading-icon-rtl, $mdc-text-field-outlined-label-position-y, -$mdc-text-field-outlined-with-leading-icon-label-position-x);
+@include mdc-floating-label-shake-keyframes(text-field-outlined-leading-icon-dense-rtl, $mdc-text-field-outlined-dense-label-position-y, -$mdc-text-field-outlined-dense-with-leading-icon-label-position-x, $mdc-text-field-dense-label-scale);
+@include mdc-floating-label-shake-keyframes(textarea, $mdc-text-field-textarea-label-position-y, 0%, $mdc-text-field-textarea-label-scale);
diff --git a/node_modules/@material/textfield/node_modules/@material/ripple/README.md b/node_modules/@material/textfield/node_modules/@material/ripple/README.md
new file mode 100644
index 0000000..2434535
--- /dev/null
+++ b/node_modules/@material/textfield/node_modules/@material/ripple/README.md
@@ -0,0 +1,340 @@
+<!--docs:
+title: "Ripples"
+layout: detail
+section: components
+excerpt: "Ink ripple touch feedback effect."
+iconId: ripple
+path: /catalog/ripples/
+-->
+
+# Ripple
+
+MDC Ripple provides the JavaScript and CSS required to provide components (or any element at all) with a material "ink ripple" interaction effect. It is designed to be efficient, uninvasive, and usable without adding any extra DOM to your elements.
+
+MDC Ripple also works without JavaScript, where it gracefully degrades to a simpler CSS-Only implementation.
+
+## Design & API Documentation
+
+<ul class="icon-list">
+  <li class="icon-list-item icon-list-item--spec">
+    <a href="https://material.io/go/design-states">Material Design guidelines: States</a>
+  </li>
+  <li class="icon-list-item icon-list-item--link">
+    <a href="https://material-components.github.io/material-components-web-catalog/#/component/ripple">Demo</a>
+  </li>
+</ul>
+
+## Installation
+
+```
+npm install @material/ripple
+```
+
+## Usage
+
+A ripple can be applied to a variety of elements to represent interactive surfaces. Several MDC Web components, such as Button, FAB, Checkbox and Radio, also use ripples.
+
+A ripple can be added to an element through either a JavaScript or CSS-only implementation. When a ripple is initialized on an element using JS, it dynamically adds a `mdc-ripple-upgraded` class to that element. If ripple JS is not initialized but Sass mixins are included on the element, the ripple uses a simpler CSS-only implementation which relies on the `:hover`, `:focus`, and `:active` pseudo-classes.
+
+### CSS Classes
+
+CSS Class | Description
+--- | ---
+`mdc-ripple-surface` | Adds a ripple to the element
+`mdc-ripple-surface--primary` | Sets the ripple color to the theme primary color
+`mdc-ripple-surface--accent` | Sets the ripple color to the theme secondary color
+
+### Sass APIs
+
+In order to fully style the ripple effect for different states (hover/focus/pressed), the following mixins must be included:
+
+* `mdc-ripple-surface`, for base styles
+* Either `mdc-ripple-radius-bounded` or `mdc-ripple-radius-unbounded`, to appropriately size the ripple on the surface
+* Either the basic or advanced `mdc-states` mixins, as explained below
+
+##### Using basic states mixins
+```css
+.my-surface {
+  @include mdc-ripple-surface;
+  @include mdc-ripple-radius-bounded;
+  @include mdc-states;
+}
+```
+
+##### Using advanced states mixins
+```css
+.my-surface {
+  @include mdc-ripple-surface;
+  @include mdc-ripple-radius-bounded;
+  @include mdc-states-base-color(black);
+  @include mdc-states-hover-opacity(.1);
+  @include mdc-states-focus-opacity(.3);
+  @include mdc-states-press-opacity(.4);
+}
+```
+
+These APIs use pseudo-elements for the ripple effect: `::before` for the background, and `::after` for the foreground.
+
+#### Ripple Mixins
+
+Mixin | Description
+--- | ---
+`mdc-ripple-surface` | Mandatory. Adds base styles for a ripple surface
+`mdc-ripple-radius-bounded($radius)` | Adds styles for the radius of the ripple effect,<br>for bounded ripple surfaces
+`mdc-ripple-radius-unbounded($radius)` | Adds styles for the radius of the ripple effect,<br>for unbounded ripple surfaces
+
+> _NOTE_: It is mandatory to include _either_ `mdc-ripple-radius-bounded` or `mdc-ripple-radius-unbounded`. In both cases, `$radius` is optional and defaults to `100%`.
+
+#### Basic States Mixins
+
+Mixin | Description
+--- | ---
+`mdc-states($color, $has-nested-focusable-element)` | Mandatory. Adds state and ripple styles in the given color
+`mdc-states-activated($color, $has-nested-focusable-element)` | Optional. Adds state and ripple styles for activated states in the given color
+`mdc-states-selected($color, $has-nested-focusable-element)` | Optional. Adds state and ripple styles for selected states in the given color
+
+> _NOTE_: Each of the mixins above adds ripple styles using the indicated color, deciding opacity values based on whether the passed color is light or dark.
+
+> _NOTE_: The `mdc-states-activated` and `mdc-states-selected` mixins add the appropriate state styles to the root element containing `&--activated` or `&--selected` modifier classes respectively.
+
+> _NOTE_: `$has-nested-focusable-element` defaults to `false` but should be set to `true` if the component contains a focusable element (e.g. an input) inside the root element.
+
+#### Advanced States Mixins
+
+When using the advanced states mixins instead of the basic states mixins, every one of the mixins below should be included at least once.
+
+These mixins can also be used to emit activated or selected styles, by applying them within a selector for
+`&--activated` or `&--selected` modifier classes.
+
+Mixin | Description
+--- | ---
+`mdc-states-base-color($color)` | Mandatory. Sets up base state styles using the provided color
+`mdc-states-hover-opacity($opacity)` | Mandatory. Adds styles for hover state using the provided opacity
+`mdc-states-focus-opacity($opacity, $has-nested-focusable-element)` | Mandatory. Adds styles for focus state using the provided opacity
+`mdc-states-press-opacity($opacity)` | Mandatory. Adds styles for press state using the provided opacity
+
+> _NOTE_: `$has-nested-focusable-element` defaults to `false` but should be set to `true` if the component contains a focusable element (e.g. an input) inside the root element.
+
+#### Sass Functions
+
+Function | Description
+--- | ---
+`mdc-states-opacity($color, $state)` | Returns the appropriate default opacity to apply to the given color in the given state (hover, focus, press, selected, or activated)
+
+### `MDCRipple`
+
+The `MDCRipple` JavaScript component allows for programmatic activation / deactivation of the ripple, for interdependent interaction between
+components. For example, this is used for making form field labels trigger the ripples in their corresponding input elements.
+
+To use the `MDCRipple` component, first [import the `MDCRipple` JS](../../docs/importing-js.md). Then, initialize the ripple with the correct DOM element.
+
+```javascript
+const surface = document.querySelector('.my-surface');
+const ripple = new MDCRipple(surface);
+```
+
+You can also use `attachTo()` as an alias if you don't care about retaining a reference to the
+ripple.
+
+```javascript
+MDCRipple.attachTo(document.querySelector('.my-surface'));
+```
+
+Property | Value Type | Description
+--- | --- | ---
+`unbounded` | Boolean | Whether or not the ripple is unbounded
+> _NOTE_: Surfaces for bounded ripples should have the `overflow` property set to `hidden`, while surfaces for unbounded ripples should have it set to `visible`.
+
+Method Signature | Description
+--- | ---
+`activate() => void` | Proxies to the foundation's `activate` method
+`deactivate() => void` | Proxies to the foundation's `deactivate` method
+`layout() => void` | Proxies to the foundation's `layout` method
+`handleFocus() => void` | Handles focus event on the ripple surface
+`handleBlur() => void` | Handles blur event on the ripple surface
+
+### `MDCRippleAdapter`
+
+| Method Signature | Description |
+| --- | --- |
+| `browserSupportsCssVars() => boolean` | Whether or not the given browser supports CSS Variables. |
+| `isUnbounded() => boolean` | Whether or not the ripple should be considered unbounded. |
+| `isSurfaceActive() => boolean` | Whether or not the surface the ripple is acting upon is [active](https://www.w3.org/TR/css3-selectors/#useraction-pseudos) |
+| `isSurfaceDisabled() => boolean` | Whether or not the ripple is attached to a disabled component |
+| `addClass(className: string) => void` | Adds a class to the ripple surface |
+| `removeClass(className: string) => void` | Removes a class from the ripple surface |
+| `containsEventTarget(target: EventTarget) => boolean` | Whether or not the ripple surface contains the given event target |
+| `registerInteractionHandler(evtType: string, handler: EventListener) => void` | Registers an event handler on the ripple surface |
+| `deregisterInteractionHandler(evtType: string, handler: EventListener) => void` | Unregisters an event handler on the ripple surface |
+| `registerDocumentInteractionHandler(evtType: string, handler: EventListener) => void` | Registers an event handler on the documentElement |
+| `deregisterDocumentInteractionHandler(evtType: string, handler: EventListener) => void` | Unregisters an event handler on the documentElement |
+| `registerResizeHandler(handler: Function) => void` | Registers a handler to be called when the ripple surface (or its viewport) resizes |
+| `deregisterResizeHandler(handler: Function) => void` | Unregisters a handler to be called when the ripple surface (or its viewport) resizes |
+| `updateCssVariable(varName: string, value: (string or null)) => void` | Sets the CSS property `varName` on the ripple surface to the value specified |
+| `computeBoundingRect() => ClientRect` | Returns the ClientRect for the surface |
+| `getWindowPageOffset() => {x: number, y: number}` | Returns the `page{X,Y}Offset` values for the window object |
+
+> _NOTE_: When implementing `browserSupportsCssVars`, please take the [Edge](#caveat-edge) and [Safari 9](#caveat-safari) considerations into account. We provide a `supportsCssVariables` function within the `util.js` which we recommend using, as it handles this for you.
+
+### `MDCRippleFoundation`
+
+Method Signature | Description
+--- | ---
+`activate() => void` | Triggers an activation of the ripple (the first stage, which happens when the ripple surface is engaged via interaction, such as a `mousedown` or a `pointerdown` event). It expands from the center.
+`deactivate() => void` | Triggers a deactivation of the ripple (the second stage, which happens when the ripple surface is engaged via interaction, such as a `mouseup` or a `pointerup` event). It expands from the center.
+`layout() => void` | Recomputes all dimensions and positions for the ripple element. Useful if a ripple surface's position or dimension is changed programmatically.
+`setUnbounded(unbounded: boolean) => void` | Sets the ripple to be unbounded or not, based on the given boolean.
+
+## Tips/Tricks
+
+### Using a sentinel element for a ripple
+
+Usually, you'll want to leverage `::before` and `::after` pseudo-elements when integrating the ripple into MDC Web components. If you can't use pseudo-elements, create a sentinel element inside your root element. The sentinel element covers the root element's surface.
+
+```html
+<div class="my-component">
+  <div class="mdc-ripple-surface"></div>
+  <!-- your component DOM -->
+</div>
+```
+
+### Unbounded ripple
+
+You can set a ripple to be _unbounded_, such as those used for MDC Checkboxes and MDC Radio Buttons, either imperatively in JS _or_ declaratively using the DOM.
+
+#### Using JS
+
+Set the `unbounded` property on the `MDCRipple` component.
+
+```javascript
+const ripple = new MDCRipple(root);
+ripple.unbounded = true;
+```
+
+#### Using DOM
+
+Add a `data-mdc-ripple-is-unbounded` attribute to your root element.
+
+```html
+<div class="my-surface" data-mdc-ripple-is-unbounded>
+  <p>A surface</p>
+</div>
+```
+
+### MDCRipple with custom functionality
+
+Usually, you'll want to use `MDCRipple` _along_ with the component for the actual UI element you're trying to add a
+ripple to. `MDCRipple` has a static `createAdapter(instance)` method that can be used to instantiate a ripple within
+any `MDCComponent` that requires custom adapter functionality.
+
+```js
+class MyMDCComponent extends MDCComponent {
+  constructor() {
+    super(...arguments);
+    const foundation = new MDCRippleFoundation(Object.assign(MDCRipple.createAdapter(this), {
+      isSurfaceActive: () => this.isActive_, /* Custom functionality */
+    }));
+    this.ripple = new MDCRipple(this.root, foundation);
+  }
+}
+```
+
+### Handling keyboard events for custom UI components
+
+Different keyboard events activate different elements. For example, the space key activates buttons, while the enter key activates links.
+
+`MDCRipple` uses the `adapter.isSurfaceActive()` method to detect whether or not a keyboard event has activated the surface the ripple is on. Our vanilla implementation of the adapter does this by checking whether the `:active` pseudo-class has been applied to the ripple surface. However, this approach will _not_ work for custom components that the browser does not apply this pseudo-class to.
+
+To make your component work properly with keyboard events, you'll have to listen for both `keydown` and `keyup` events to set some state that determines whether or not the surface is "active".
+
+```js
+class MyComponent {
+  constructor(element) {
+    this.root = element;
+    this.active = false;
+    this.root.addEventListener('keydown', evt => {
+      if (isSpace(evt)) {
+        this.active = true;
+      }
+    });
+    this.root.addEventListener('keyup', evt => {
+      if (isSpace(evt)) {
+        this.active = false;
+      }
+    });
+
+    const foundation = new MDCRippleFoundation(Object.assign(MDCRipple.createAdapter(this), {
+      // ...
+      isSurfaceActive: () => this.active
+    }));
+    this.ripple = new MDCRipple(this.root, foundation);
+  }
+}
+```
+
+### Specifying known element dimensions for asynchronous style loading
+
+If you asynchronously load style resources, such as loading stylesheets dynamically or loading fonts, then `adapter.getClientRect()` may return _incorrect_ dimensions if the ripple is initialized before the stylesheet/font has loaded. In this case, you can override the default behavior of `getClientRect()` to return the correct results.
+
+For example, if you know an icon font sizes its elements to `24px` width and height:
+```js
+const foundation = new MDCRippleFoundation({
+  // ...
+  computeBoundingRect: () => {
+    const {left, top} = element.getBoundingClientRect();
+    const dim = 24;
+    return {
+      left,
+      top,
+      width: dim,
+      height: dim,
+      right: left + dim,
+      bottom: top + dim
+    };
+  }
+});
+this.ripple = new MDCRipple(this.root, foundation);
+```
+
+### The util API
+
+External frameworks and libraries can use the following utility methods when integrating a component.
+
+Method Signature | Description
+--- | ---
+`util.supportsCssVariables(windowObj, forceRefresh = false) => Boolean` | Determine whether the current browser supports CSS variables (custom properties)
+`util.applyPassive(globalObj = window, forceRefresh = false) => object` | Determine whether the current browser supports passive event listeners
+`util.getMatchesProperty(HTMLElementPrototype) => Function` | Return the correct "matches" property to use on the current browser
+`util.getNormalizedEventCoords(ev, pageOffset, clientRect) => object` | Determines X/Y coordinates of an event normalized for touch events and ripples
+
+> _NOTE_: The functions `util.supportsCssVariables` and `util.applyPassive` cache their results; `forceRefresh` will force recomputation, but is used mainly for testing and should not be necessary in normal use.
+
+## Caveats
+
+### Caveat: Edge
+
+> TL;DR ripples are disabled in Edge because of issues with its support of CSS variables in pseudo elements.
+
+Edge introduced CSS variables in version 15. Unfortunately, there are
+[known issues](https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/11495448/)
+involving its implementation for pseudo-elements, which cause ripples to behave incorrectly.
+We feature-detect Edge's buggy behavior as it pertains to `::before`, and do not initialize ripples if the bug is
+observed. Earlier versions of Edge (and IE) do not support CSS variables at all,
+and as such ripples are never initialized.
+
+### Caveat: Safari 9
+
+> TL;DR ripples are disabled in Safari 9 because of a bug with CSS variables.
+
+The ripple works by updating CSS variables used by pseudo-elements. Unfortunately, in Safari 9.1, there is a bug where updating a CSS variable on an element will _not_ trigger a style recalculation on that element's pseudo-elements (try out [this codepen](http://codepen.io/traviskaufman/pen/jARYOR) in Chrome, and then in Safari 9.1 to see the issue). Webkit builds which have this bug fixed (e.g. the builds used in Safari 10+)
+support [CSS 4 Hex Notation](https://drafts.csswg.org/css-color/#hex-notation) while those without the fix don't. We feature-detect whether we are working with a WebKit build that can handle our usage of CSS variables.
+
+### Caveat: Mobile Safari
+
+> TL;DR for CSS-only ripple styles to work as intended, register a `touchstart` event handler on the affected element or its ancestor.
+
+Mobile Safari does not trigger `:active` styles noticeably by default, as
+[documented](https://developer.apple.com/library/content/documentation/AppleApplications/Reference/SafariWebContent/AdjustingtheTextSize/AdjustingtheTextSize.html#//apple_ref/doc/uid/TP40006510-SW5)
+in the Safari Web Content Guide. This effectively suppresses the intended pressed state styles for CSS-only ripple surfaces. This behavior can be remedied by registering a `touchstart` event handler on the element, or on any common ancestor of the desired elements.
+
+See [this StackOverflow answer](https://stackoverflow.com/a/33681490) for additional information on mobile Safari's behavior.
diff --git a/node_modules/@material/textfield/node_modules/@material/ripple/_functions.scss b/node_modules/@material/textfield/node_modules/@material/ripple/_functions.scss
new file mode 100644
index 0000000..9d278ff
--- /dev/null
+++ b/node_modules/@material/textfield/node_modules/@material/ripple/_functions.scss
@@ -0,0 +1,48 @@
+//
+// Copyright 2016 Google Inc. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+@import "@material/theme/functions";
+@import "@material/theme/variables"; // for mdc-theme-prop-value
+@import "./variables";
+
+//
+// Public
+//
+
+@function mdc-states-opacity($color, $state) {
+  $opacity-map: mdc-states-opacities_($color);
+
+  @if not map-has-key($opacity-map, $state) {
+    @error "Invalid state: '#{$state}'. Choose one of: #{map-keys($opacity-map)}";
+  }
+
+  @return map-get($opacity-map, $state);
+}
+
+//
+// Private
+//
+
+@function mdc-states-opacities_($color) {
+  $color-value: mdc-theme-prop-value($color);
+  $opacity-map: if(
+    mdc-theme-tone($color-value) == "light",
+    $mdc-ripple-light-ink-opacities,
+    $mdc-ripple-dark-ink-opacities
+  );
+
+  @return $opacity-map;
+}
diff --git a/node_modules/@material/textfield/node_modules/@material/ripple/_keyframes.scss b/node_modules/@material/textfield/node_modules/@material/ripple/_keyframes.scss
new file mode 100644
index 0000000..37356bb
--- /dev/null
+++ b/node_modules/@material/textfield/node_modules/@material/ripple/_keyframes.scss
@@ -0,0 +1,59 @@
+//
+// Copyright 2017 Google Inc. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+// MDC Ripple keyframes are split into their own file so that _mixins.scss can rely on them.
+
+@import "@material/animation/variables";
+@import "./variables";
+
+@mixin mdc-ripple-keyframes_ {
+  @keyframes mdc-ripple-fg-radius-in {
+    from {
+      animation-timing-function: $mdc-animation-standard-curve-timing-function;
+      // NOTE: For these keyframes, we do not need custom property fallbacks because they are only
+      // used in conjunction with `.mdc-ripple-upgraded`. Since MDCRippleFoundation checks to ensure
+      // that custom properties are supported within the browser before adding this class, we can
+      // safely use them without a fallback.
+      transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+    }
+
+    to {
+      transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+    }
+  }
+
+  @keyframes mdc-ripple-fg-opacity-in {
+    from {
+      animation-timing-function: linear;
+      opacity: 0;
+    }
+
+    to {
+      opacity: var(--mdc-ripple-fg-opacity, 0);
+    }
+  }
+
+  @keyframes mdc-ripple-fg-opacity-out {
+    from {
+      animation-timing-function: linear;
+      opacity: var(--mdc-ripple-fg-opacity, 0);
+    }
+
+    to {
+      opacity: 0;
+    }
+  }
+}
diff --git a/node_modules/@material/textfield/node_modules/@material/ripple/_mixins.scss b/node_modules/@material/textfield/node_modules/@material/ripple/_mixins.scss
new file mode 100644
index 0000000..094e006
--- /dev/null
+++ b/node_modules/@material/textfield/node_modules/@material/ripple/_mixins.scss
@@ -0,0 +1,228 @@
+//
+// Copyright 2016 Google Inc. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+@import "@material/animation/variables";
+@import "@material/theme/mixins";
+@import "./functions";
+@import "./variables";
+
+@mixin mdc-ripple-surface() {
+  --mdc-ripple-fg-size: 0;
+  --mdc-ripple-left: 0;
+  --mdc-ripple-top: 0;
+  --mdc-ripple-fg-scale: 1;
+  --mdc-ripple-fg-translate-end: 0;
+  --mdc-ripple-fg-translate-start: 0;
+
+  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
+  will-change: transform, opacity;
+
+  &::before,
+  &::after {
+    position: absolute;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: "";
+  }
+
+  &::before {
+    transition: opacity $mdc-states-wash-duration linear;
+    z-index: 1; // Ensure that the ripple wash for hover/focus states is displayed on top of positioned child elements
+  }
+
+  // Common styles for upgraded surfaces (some of these depend on custom properties set via JS or other mixins)
+
+  &.mdc-ripple-upgraded::before {
+    transform: scale(var(--mdc-ripple-fg-scale, 1));
+  }
+
+  &.mdc-ripple-upgraded::after {
+    top: 0;
+
+    /* @noflip */
+    left: 0;
+    transform: scale(0);
+    transform-origin: center center;
+  }
+
+  &.mdc-ripple-upgraded--unbounded::after {
+    top: var(--mdc-ripple-top, 0);
+
+    /* @noflip */
+    left: var(--mdc-ripple-left, 0);
+  }
+
+  &.mdc-ripple-upgraded--foreground-activation::after {
+    animation:
+      $mdc-ripple-translate-duration mdc-ripple-fg-radius-in forwards,
+      $mdc-ripple-fade-in-duration mdc-ripple-fg-opacity-in forwards;
+  }
+
+  &.mdc-ripple-upgraded--foreground-deactivation::after {
+    animation: $mdc-ripple-fade-out-duration mdc-ripple-fg-opacity-out;
+    // Retain transform from mdc-ripple-fg-radius-in activation
+    transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+  }
+}
+
+@mixin mdc-states-base-color($color) {
+  // Opacity styles are here (rather than in mdc-ripple-surface) to ensure that opacity is re-initialized for
+  // cases where this mixin is used to override another inherited use of itself,
+  // without needing to re-include mdc-ripple-surface.
+  &::before,
+  &::after {
+    @include mdc-theme-prop(background-color, $color, $edgeOptOut: true);
+  }
+}
+
+@mixin mdc-states-hover-opacity($opacity) {
+  // Background wash styles, for both CSS-only and upgraded stateful surfaces
+  &:hover::before {
+    opacity: $opacity;
+  }
+}
+
+@mixin mdc-states-focus-opacity($opacity, $has-nested-focusable-element: false) {
+  // Focus overrides hover by reusing the ::before pseudo-element.
+  // :focus-within generally works on non-MS browsers and matches when a *child* of the element has focus.
+  // It is useful for cases where a component has a focusable element within the root node, e.g. text field,
+  // but undesirable in general in case of nested stateful components.
+  // We use a modifier class for JS-enabled surfaces to support all use cases in all browsers.
+  $cssOnlyFocusSelector: if(
+    $has-nested-focusable-element,
+    "&:not(.mdc-ripple-upgraded):focus::before, &:not(.mdc-ripple-upgraded):focus-within::before",
+    "&:not(.mdc-ripple-upgraded):focus::before"
+  );
+
+  #{$cssOnlyFocusSelector},
+  &.mdc-ripple-upgraded--background-focused::before {
+    // Note that this duration is only effective on focus, not blur
+    transition-duration: 75ms;
+    opacity: $opacity;
+  }
+}
+
+@mixin mdc-states-press-opacity($opacity) {
+  // Styles for non-upgraded (CSS-only) stateful surfaces
+
+  &:not(.mdc-ripple-upgraded) {
+    // Apply press additively by using the ::after pseudo-element
+    &::after {
+      transition: opacity $mdc-ripple-fade-out-duration linear;
+    }
+
+    &:active::after {
+      transition-duration: $mdc-ripple-fade-in-duration;
+      opacity: $opacity;
+    }
+  }
+
+  &.mdc-ripple-upgraded {
+    --mdc-ripple-fg-opacity: #{$opacity};
+  }
+}
+
+// Simple mixin for base states which automatically selects opacity values based on whether the ink color is
+// light or dark.
+@mixin mdc-states($color: black, $has-nested-focusable-element: false) {
+  @include mdc-states-interactions_($color, $has-nested-focusable-element);
+}
+
+// Simple mixin for activated states which automatically selects opacity values based on whether the ink color is
+// light or dark.
+@mixin mdc-states-activated($color, $has-nested-focusable-element: false) {
+  $activated-opacity: mdc-states-opacity($color, activated);
+
+  &--activated {
+    // Stylelint seems to think that '&' qualifies as a type selector here?
+    // stylelint-disable-next-line selector-max-type
+    &::before {
+      opacity: $activated-opacity;
+    }
+
+    @include mdc-states-interactions_($color, $has-nested-focusable-element, $activated-opacity);
+  }
+}
+
+// Simple mixin for selected states which automatically selects opacity values based on whether the ink color is
+// light or dark.
+@mixin mdc-states-selected($color, $has-nested-focusable-element: false) {
+  $selected-opacity: mdc-states-opacity($color, selected);
+
+  &--selected {
+    // stylelint-disable-next-line selector-max-type
+    &::before {
+      opacity: $selected-opacity;
+    }
+
+    @include mdc-states-interactions_($color, $has-nested-focusable-element, $selected-opacity);
+  }
+}
+
+@mixin mdc-ripple-radius-bounded($radius: 100%) {
+  &::before,
+  &::after {
+    top: calc(50% - #{$radius});
+
+    /* @noflip */
+    left: calc(50% - #{$radius});
+    width: $radius * 2;
+    height: $radius * 2;
+  }
+
+  &.mdc-ripple-upgraded::after {
+    width: var(--mdc-ripple-fg-size, $radius);
+    height: var(--mdc-ripple-fg-size, $radius);
+  }
+}
+
+@mixin mdc-ripple-radius-unbounded($radius: 100%) {
+  &::before,
+  &::after {
+    top: calc(50% - #{$radius / 2});
+
+    /* @noflip */
+    left: calc(50% - #{$radius / 2});
+    width: $radius;
+    height: $radius;
+  }
+
+  &.mdc-ripple-upgraded::before,
+  &.mdc-ripple-upgraded::after {
+    top: var(--mdc-ripple-top, calc(50% - #{$radius / 2}));
+
+    /* @noflip */
+    left: var(--mdc-ripple-left, calc(50% - #{$radius / 2}));
+    width: var(--mdc-ripple-fg-size, $radius);
+    height: var(--mdc-ripple-fg-size, $radius);
+  }
+
+  &.mdc-ripple-upgraded::after {
+    width: var(--mdc-ripple-fg-size, $radius);
+    height: var(--mdc-ripple-fg-size, $radius);
+  }
+}
+
+@mixin mdc-states-interactions_($color, $has-nested-focusable-element, $opacity-modifier: 0) {
+  @include mdc-states-base-color($color);
+  @include mdc-states-hover-opacity(mdc-states-opacity($color, hover) + $opacity-modifier);
+  @include mdc-states-focus-opacity(
+    mdc-states-opacity($color, focus) + $opacity-modifier,
+    $has-nested-focusable-element
+  );
+  @include mdc-states-press-opacity(mdc-states-opacity($color, press) + $opacity-modifier);
+}
diff --git a/node_modules/@material/textfield/node_modules/@material/ripple/_variables.scss b/node_modules/@material/textfield/node_modules/@material/ripple/_variables.scss
new file mode 100644
index 0000000..4ab1fac
--- /dev/null
+++ b/node_modules/@material/textfield/node_modules/@material/ripple/_variables.scss
@@ -0,0 +1,41 @@
+//
+// Copyright 2016 Google Inc. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+$mdc-ripple-fade-in-duration: 75ms;
+$mdc-ripple-fade-out-duration: 150ms;
+$mdc-ripple-translate-duration: 225ms;
+$mdc-states-wash-duration: 15ms;
+
+$mdc-ripple-dark-ink-opacities: (
+  hover: .04,
+  focus: .12,
+  press: .16,
+  selected: .08,
+  activated: .12
+) !default;
+
+$mdc-ripple-light-ink-opacities: (
+  hover: .08,
+  focus: .24,
+  press: .32,
+  selected: .16,
+  activated: .24
+) !default;
+
+// Legacy
+
+$mdc-ripple-pressed-dark-ink-opacity: .16;
+$mdc-ripple-pressed-light-ink-opacity: .32;
diff --git a/node_modules/@material/textfield/node_modules/@material/ripple/adapter.js b/node_modules/@material/textfield/node_modules/@material/ripple/adapter.js
new file mode 100644
index 0000000..3103503
--- /dev/null
+++ b/node_modules/@material/textfield/node_modules/@material/ripple/adapter.js
@@ -0,0 +1,110 @@
+/**
+ * @license
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/* eslint no-unused-vars: [2, {"args": "none"}] */
+
+/**
+ * Adapter for MDC Ripple. Provides an interface for managing
+ * - classes
+ * - dom
+ * - CSS variables
+ * - position
+ * - dimensions
+ * - scroll position
+ * - event handlers
+ * - unbounded, active and disabled states
+ *
+ * Additionally, provides type information for the adapter to the Closure
+ * compiler.
+ *
+ * Implement this adapter for your framework of choice to delegate updates to
+ * the component in your framework of choice. See architecture documentation
+ * for more details.
+ * https://github.com/material-components/material-components-web/blob/master/docs/code/architecture.md
+ *
+ * @record
+ */
+class MDCRippleAdapter {
+  /** @return {boolean} */
+  browserSupportsCssVars() {}
+
+  /** @return {boolean} */
+  isUnbounded() {}
+
+  /** @return {boolean} */
+  isSurfaceActive() {}
+
+  /** @return {boolean} */
+  isSurfaceDisabled() {}
+
+  /** @param {string} className */
+  addClass(className) {}
+
+  /** @param {string} className */
+  removeClass(className) {}
+
+  /** @param {!EventTarget} target */
+  containsEventTarget(target) {}
+
+  /**
+   * @param {string} evtType
+   * @param {!Function} handler
+   */
+  registerInteractionHandler(evtType, handler) {}
+
+  /**
+   * @param {string} evtType
+   * @param {!Function} handler
+   */
+  deregisterInteractionHandler(evtType, handler) {}
+
+  /**
+   * @param {string} evtType
+   * @param {!Function} handler
+   */
+  registerDocumentInteractionHandler(evtType, handler) {}
+
+  /**
+   * @param {string} evtType
+   * @param {!Function} handler
+   */
+  deregisterDocumentInteractionHandler(evtType, handler) {}
+
+  /**
+   * @param {!Function} handler
+   */
+  registerResizeHandler(handler) {}
+
+  /**
+   * @param {!Function} handler
+   */
+  deregisterResizeHandler(handler) {}
+
+  /**
+   * @param {string} varName
+   * @param {?number|string} value
+   */
+  updateCssVariable(varName, value) {}
+
+  /** @return {!ClientRect} */
+  computeBoundingRect() {}
+
+  /** @return {{x: number, y: number}} */
+  getWindowPageOffset() {}
+}
+
+export default MDCRippleAdapter;
diff --git a/node_modules/@material/textfield/node_modules/@material/ripple/common.scss b/node_modules/@material/textfield/node_modules/@material/ripple/common.scss
new file mode 100644
index 0000000..956f3b7
--- /dev/null
+++ b/node_modules/@material/textfield/node_modules/@material/ripple/common.scss
@@ -0,0 +1,38 @@
+//
+// Copyright 2017 Google Inc. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+@import "@material/base/mixins";
+@import "./keyframes";
+
+// Ensure that styles needed by any component using MDC Ripple are emitted, but only once.
+// (Every component using MDC Ripple imports these mixins, but doesn't necessarily import mdc-ripple.scss.)
+@include mdc-base-emit-once("mdc-ripple/common") {
+  @include mdc-ripple-keyframes_;
+
+  // Styles used to detect buggy behavior of CSS custom properties in Edge.
+  // See: https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/11495448/
+  // This is included in _mixins.scss rather than mdc-ripple.scss so that it will be
+  // present for other components which rely on ripple as well as mdc-ripple itself.
+  .mdc-ripple-surface--test-edge-var-bug {
+    --mdc-ripple-surface-test-edge-var: 1px solid #000;
+
+    visibility: hidden;
+
+    &::before {
+      border: var(--mdc-ripple-surface-test-edge-var);
+    }
+  }
+}
diff --git a/node_modules/@material/textfield/node_modules/@material/ripple/constants.js b/node_modules/@material/textfield/node_modules/@material/ripple/constants.js
new file mode 100644
index 0000000..ef1b27f
--- /dev/null
+++ b/node_modules/@material/textfield/node_modules/@material/ripple/constants.js
@@ -0,0 +1,46 @@
+/**
+ * @license
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+const cssClasses = {
+  // Ripple is a special case where the "root" component is really a "mixin" of sorts,
+  // given that it's an 'upgrade' to an existing component. That being said it is the root
+  // CSS class that all other CSS classes derive from.
+  ROOT: 'mdc-ripple-upgraded',
+  UNBOUNDED: 'mdc-ripple-upgraded--unbounded',
+  BG_FOCUSED: 'mdc-ripple-upgraded--background-focused',
+  FG_ACTIVATION: 'mdc-ripple-upgraded--foreground-activation',
+  FG_DEACTIVATION: 'mdc-ripple-upgraded--foreground-deactivation',
+};
+
+const strings = {
+  VAR_LEFT: '--mdc-ripple-left',
+  VAR_TOP: '--mdc-ripple-top',
+  VAR_FG_SIZE: '--mdc-ripple-fg-size',
+  VAR_FG_SCALE: '--mdc-ripple-fg-scale',
+  VAR_FG_TRANSLATE_START: '--mdc-ripple-fg-translate-start',
+  VAR_FG_TRANSLATE_END: '--mdc-ripple-fg-translate-end',
+};
+
+const numbers = {
+  PADDING: 10,
+  INITIAL_ORIGIN_SCALE: 0.6,
+  DEACTIVATION_TIMEOUT_MS: 225, // Corresponds to $mdc-ripple-translate-duration (i.e. activation animation duration)
+  FG_DEACTIVATION_MS: 150, // Corresponds to $mdc-ripple-fade-out-duration (i.e. deactivation animation duration)
+  TAP_DELAY_MS: 300, // Delay between touch and simulated mouse events on touch devices
+};
+
+export {cssClasses, strings, numbers};
diff --git a/node_modules/@material/textfield/node_modules/@material/ripple/dist/mdc.ripple.css b/node_modules/@material/textfield/node_modules/@material/ripple/dist/mdc.ripple.css
new file mode 100644
index 0000000..485b3ff
--- /dev/null
+++ b/node_modules/@material/textfield/node_modules/@material/ripple/dist/mdc.ripple.css
@@ -0,0 +1,185 @@
+/*!
+ Material Components for the Web
+ Copyright (c) 2018 Google Inc.
+ License: Apache-2.0
+*/
+@-webkit-keyframes mdc-ripple-fg-radius-in {
+  from {
+    -webkit-animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+            animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+            transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1); }
+  to {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); } }
+
+@keyframes mdc-ripple-fg-radius-in {
+  from {
+    -webkit-animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+            animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+            transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1); }
+  to {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); } }
+
+@-webkit-keyframes mdc-ripple-fg-opacity-in {
+  from {
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear;
+    opacity: 0; }
+  to {
+    opacity: var(--mdc-ripple-fg-opacity, 0); } }
+
+@keyframes mdc-ripple-fg-opacity-in {
+  from {
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear;
+    opacity: 0; }
+  to {
+    opacity: var(--mdc-ripple-fg-opacity, 0); } }
+
+@-webkit-keyframes mdc-ripple-fg-opacity-out {
+  from {
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear;
+    opacity: var(--mdc-ripple-fg-opacity, 0); }
+  to {
+    opacity: 0; } }
+
+@keyframes mdc-ripple-fg-opacity-out {
+  from {
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear;
+    opacity: var(--mdc-ripple-fg-opacity, 0); }
+  to {
+    opacity: 0; } }
+
+.mdc-ripple-surface--test-edge-var-bug {
+  --mdc-ripple-surface-test-edge-var: 1px solid #000;
+  visibility: hidden; }
+  .mdc-ripple-surface--test-edge-var-bug::before {
+    border: var(--mdc-ripple-surface-test-edge-var); }
+
+.mdc-ripple-surface {
+  --mdc-ripple-fg-size: 0;
+  --mdc-ripple-left: 0;
+  --mdc-ripple-top: 0;
+  --mdc-ripple-fg-scale: 1;
+  --mdc-ripple-fg-translate-end: 0;
+  --mdc-ripple-fg-translate-start: 0;
+  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
+  will-change: transform, opacity;
+  position: relative;
+  outline: none;
+  overflow: hidden; }
+  .mdc-ripple-surface::before, .mdc-ripple-surface::after {
+    position: absolute;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+  .mdc-ripple-surface::before {
+    transition: opacity 15ms linear;
+    z-index: 1; }
+  .mdc-ripple-surface.mdc-ripple-upgraded::before {
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 1));
+            transform: scale(var(--mdc-ripple-fg-scale, 1)); }
+  .mdc-ripple-surface.mdc-ripple-upgraded::after {
+    top: 0;
+    /* @noflip */
+    left: 0;
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-ripple-surface.mdc-ripple-upgraded--unbounded::after {
+    top: var(--mdc-ripple-top, 0);
+    /* @noflip */
+    left: var(--mdc-ripple-left, 0); }
+  .mdc-ripple-surface.mdc-ripple-upgraded--foreground-activation::after {
+    -webkit-animation: 225ms mdc-ripple-fg-radius-in forwards, 75ms mdc-ripple-fg-opacity-in forwards;
+            animation: 225ms mdc-ripple-fg-radius-in forwards, 75ms mdc-ripple-fg-opacity-in forwards; }
+  .mdc-ripple-surface.mdc-ripple-upgraded--foreground-deactivation::after {
+    -webkit-animation: 150ms mdc-ripple-fg-opacity-out;
+            animation: 150ms mdc-ripple-fg-opacity-out;
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); }
+  .mdc-ripple-surface::before, .mdc-ripple-surface::after {
+    background-color: black; }
+  .mdc-ripple-surface:hover::before {
+    opacity: 0.04; }
+  .mdc-ripple-surface:not(.mdc-ripple-upgraded):focus::before, .mdc-ripple-surface.mdc-ripple-upgraded--background-focused::before {
+    transition-duration: 75ms;
+    opacity: 0.12; }
+  .mdc-ripple-surface:not(.mdc-ripple-upgraded)::after {
+    transition: opacity 150ms linear; }
+  .mdc-ripple-surface:not(.mdc-ripple-upgraded):active::after {
+    transition-duration: 75ms;
+    opacity: 0.16; }
+  .mdc-ripple-surface.mdc-ripple-upgraded {
+    --mdc-ripple-fg-opacity: 0.16; }
+  .mdc-ripple-surface::before, .mdc-ripple-surface::after {
+    top: calc(50% - 100%);
+    /* @noflip */
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%; }
+  .mdc-ripple-surface.mdc-ripple-upgraded::after {
+    width: var(--mdc-ripple-fg-size, 100%);
+    height: var(--mdc-ripple-fg-size, 100%); }
+  .mdc-ripple-surface[data-mdc-ripple-is-unbounded] {
+    overflow: visible; }
+    .mdc-ripple-surface[data-mdc-ripple-is-unbounded]::before, .mdc-ripple-surface[data-mdc-ripple-is-unbounded]::after {
+      top: calc(50% - 50%);
+      /* @noflip */
+      left: calc(50% - 50%);
+      width: 100%;
+      height: 100%; }
+    .mdc-ripple-surface[data-mdc-ripple-is-unbounded].mdc-ripple-upgraded::before, .mdc-ripple-surface[data-mdc-ripple-is-unbounded].mdc-ripple-upgraded::after {
+      top: var(--mdc-ripple-top, calc(50% - 50%));
+      /* @noflip */
+      left: var(--mdc-ripple-left, calc(50% - 50%));
+      width: var(--mdc-ripple-fg-size, 100%);
+      height: var(--mdc-ripple-fg-size, 100%); }
+    .mdc-ripple-surface[data-mdc-ripple-is-unbounded].mdc-ripple-upgraded::after {
+      width: var(--mdc-ripple-fg-size, 100%);
+      height: var(--mdc-ripple-fg-size, 100%); }
+  .mdc-ripple-surface--primary::before, .mdc-ripple-surface--primary::after {
+    background-color: #6200ee; }
+    @supports not (-ms-ime-align: auto) {
+      .mdc-ripple-surface--primary::before, .mdc-ripple-surface--primary::after {
+        /* @alternate */
+        background-color: var(--mdc-theme-primary, #6200ee); } }
+  .mdc-ripple-surface--primary:hover::before {
+    opacity: 0.04; }
+  .mdc-ripple-surface--primary:not(.mdc-ripple-upgraded):focus::before, .mdc-ripple-surface--primary.mdc-ripple-upgraded--background-focused::before {
+    transition-duration: 75ms;
+    opacity: 0.12; }
+  .mdc-ripple-surface--primary:not(.mdc-ripple-upgraded)::after {
+    transition: opacity 150ms linear; }
+  .mdc-ripple-surface--primary:not(.mdc-ripple-upgraded):active::after {
+    transition-duration: 75ms;
+    opacity: 0.16; }
+  .mdc-ripple-surface--primary.mdc-ripple-upgraded {
+    --mdc-ripple-fg-opacity: 0.16; }
+  .mdc-ripple-surface--accent::before, .mdc-ripple-surface--accent::after {
+    background-color: #018786; }
+    @supports not (-ms-ime-align: auto) {
+      .mdc-ripple-surface--accent::before, .mdc-ripple-surface--accent::after {
+        /* @alternate */
+        background-color: var(--mdc-theme-secondary, #018786); } }
+  .mdc-ripple-surface--accent:hover::before {
+    opacity: 0.04; }
+  .mdc-ripple-surface--accent:not(.mdc-ripple-upgraded):focus::before, .mdc-ripple-surface--accent.mdc-ripple-upgraded--background-focused::before {
+    transition-duration: 75ms;
+    opacity: 0.12; }
+  .mdc-ripple-surface--accent:not(.mdc-ripple-upgraded)::after {
+    transition: opacity 150ms linear; }
+  .mdc-ripple-surface--accent:not(.mdc-ripple-upgraded):active::after {
+    transition-duration: 75ms;
+    opacity: 0.16; }
+  .mdc-ripple-surface--accent.mdc-ripple-upgraded {
+    --mdc-ripple-fg-opacity: 0.16; }
+
+/*# sourceMappingURL=mdc.ripple.css.map*/
\ No newline at end of file
diff --git a/node_modules/@material/textfield/node_modules/@material/ripple/dist/mdc.ripple.js b/node_modules/@material/textfield/node_modules/@material/ripple/dist/mdc.ripple.js
new file mode 100644
index 0000000..794391d
--- /dev/null
+++ b/node_modules/@material/textfield/node_modules/@material/ripple/dist/mdc.ripple.js
@@ -0,0 +1,1792 @@
+/*!
+ Material Components for the Web
+ Copyright (c) 2018 Google Inc.
+ License: Apache-2.0
+*/
+(function webpackUniversalModuleDefinition(root, factory) {
+	if(typeof exports === 'object' && typeof module === 'object')
+		module.exports = factory();
+	else if(typeof define === 'function' && define.amd)
+		define([], factory);
+	else if(typeof exports === 'object')
+		exports["ripple"] = factory();
+	else
+		root["mdc"] = root["mdc"] || {}, root["mdc"]["ripple"] = factory();
+})(this, function() {
+return /******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, {
+/******/ 				configurable: false,
+/******/ 				enumerable: true,
+/******/ 				get: getter
+/******/ 			});
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "";
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = 4);
+/******/ })
+/************************************************************************/
+/******/ ([
+/* 0 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * @license
+ * Copyright 2016 Google Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * @template A
+ */
+var MDCFoundation = function () {
+  _createClass(MDCFoundation, null, [{
+    key: "cssClasses",
+
+    /** @return enum{cssClasses} */
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports every
+      // CSS class the foundation class needs as a property. e.g. {ACTIVE: 'mdc-component--active'}
+      return {};
+    }
+
+    /** @return enum{strings} */
+
+  }, {
+    key: "strings",
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports all
+      // semantic strings as constants. e.g. {ARIA_ROLE: 'tablist'}
+      return {};
+    }
+
+    /** @return enum{numbers} */
+
+  }, {
+    key: "numbers",
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports all
+      // of its semantic numbers as constants. e.g. {ANIMATION_DELAY_MS: 350}
+      return {};
+    }
+
+    /** @return {!Object} */
+
+  }, {
+    key: "defaultAdapter",
+    get: function get() {
+      // Classes extending MDCFoundation may choose to implement this getter in order to provide a convenient
+      // way of viewing the necessary methods of an adapter. In the future, this could also be used for adapter
+      // validation.
+      return {};
+    }
+
+    /**
+     * @param {A=} adapter
+     */
+
+  }]);
+
+  function MDCFoundation() {
+    var adapter = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+
+    _classCallCheck(this, MDCFoundation);
+
+    /** @protected {!A} */
+    this.adapter_ = adapter;
+  }
+
+  _createClass(MDCFoundation, [{
+    key: "init",
+    value: function init() {
+      // Subclasses should override this method to perform initialization routines (registering events, etc.)
+    }
+  }, {
+    key: "destroy",
+    value: function destroy() {
+      // Subclasses should override this method to perform de-initialization routines (de-registering events, etc.)
+    }
+  }]);
+
+  return MDCFoundation;
+}();
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCFoundation);
+
+/***/ }),
+/* 1 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__foundation__ = __webpack_require__(0);
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * @license
+ * Copyright 2016 Google Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+/**
+ * @template F
+ */
+
+var MDCComponent = function () {
+  _createClass(MDCComponent, null, [{
+    key: 'attachTo',
+
+    /**
+     * @param {!Element} root
+     * @return {!MDCComponent}
+     */
+    value: function attachTo(root) {
+      // Subclasses which extend MDCBase should provide an attachTo() method that takes a root element and
+      // returns an instantiated component with its root set to that element. Also note that in the cases of
+      // subclasses, an explicit foundation class will not have to be passed in; it will simply be initialized
+      // from getDefaultFoundation().
+      return new MDCComponent(root, new __WEBPACK_IMPORTED_MODULE_0__foundation__["a" /* default */]());
+    }
+
+    /**
+     * @param {!Element} root
+     * @param {F=} foundation
+     * @param {...?} args
+     */
+
+  }]);
+
+  function MDCComponent(root) {
+    var foundation = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : undefined;
+
+    _classCallCheck(this, MDCComponent);
+
+    /** @protected {!Element} */
+    this.root_ = root;
+
+    for (var _len = arguments.length, args = Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++) {
+      args[_key - 2] = arguments[_key];
+    }
+
+    this.initialize.apply(this, args);
+    // Note that we initialize foundation here and not within the constructor's default param so that
+    // this.root_ is defined and can be used within the foundation class.
+    /** @protected {!F} */
+    this.foundation_ = foundation === undefined ? this.getDefaultFoundation() : foundation;
+    this.foundation_.init();
+    this.initialSyncWithDOM();
+  }
+
+  _createClass(MDCComponent, [{
+    key: 'initialize',
+    value: function initialize() /* ...args */{}
+    // Subclasses can override this to do any additional setup work that would be considered part of a
+    // "constructor". Essentially, it is a hook into the parent constructor before the foundation is
+    // initialized. Any additional arguments besides root and foundation will be passed in here.
+
+
+    /**
+     * @return {!F} foundation
+     */
+
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      // Subclasses must override this method to return a properly configured foundation class for the
+      // component.
+      throw new Error('Subclasses must override getDefaultFoundation to return a properly configured ' + 'foundation class');
+    }
+  }, {
+    key: 'initialSyncWithDOM',
+    value: function initialSyncWithDOM() {
+      // Subclasses should override this method if they need to perform work to synchronize with a host DOM
+      // object. An example of this would be a form control wrapper that needs to synchronize its internal state
+      // to some property or attribute of the host DOM. Please note: this is *not* the place to perform DOM
+      // reads/writes that would cause layout / paint, as this is called synchronously from within the constructor.
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      // Subclasses may implement this method to release any resources / deregister any listeners they have
+      // attached. An example of this might be deregistering a resize event from the window object.
+      this.foundation_.destroy();
+    }
+
+    /**
+     * Wrapper method to add an event listener to the component's root element. This is most useful when
+     * listening for custom events.
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: 'listen',
+    value: function listen(evtType, handler) {
+      this.root_.addEventListener(evtType, handler);
+    }
+
+    /**
+     * Wrapper method to remove an event listener to the component's root element. This is most useful when
+     * unlistening for custom events.
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: 'unlisten',
+    value: function unlisten(evtType, handler) {
+      this.root_.removeEventListener(evtType, handler);
+    }
+
+    /**
+     * Fires a cross-browser-compatible custom event from the component root of the given type,
+     * with the given data.
+     * @param {string} evtType
+     * @param {!Object} evtData
+     * @param {boolean=} shouldBubble
+     */
+
+  }, {
+    key: 'emit',
+    value: function emit(evtType, evtData) {
+      var shouldBubble = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
+
+      var evt = void 0;
+      if (typeof CustomEvent === 'function') {
+        evt = new CustomEvent(evtType, {
+          detail: evtData,
+          bubbles: shouldBubble
+        });
+      } else {
+        evt = document.createEvent('CustomEvent');
+        evt.initCustomEvent(evtType, shouldBubble, false, evtData);
+      }
+
+      this.root_.dispatchEvent(evt);
+    }
+  }]);
+
+  return MDCComponent;
+}();
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCComponent);
+
+/***/ }),
+/* 2 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "supportsCssVariables", function() { return supportsCssVariables; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "applyPassive", function() { return applyPassive; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "getMatchesProperty", function() { return getMatchesProperty; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "getNormalizedEventCoords", function() { return getNormalizedEventCoords; });
+/**
+ * @license
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * Stores result from supportsCssVariables to avoid redundant processing to detect CSS custom variable support.
+ * @private {boolean|undefined}
+ */
+var supportsCssVariables_ = void 0;
+
+/**
+ * Stores result from applyPassive to avoid redundant processing to detect passive event listener support.
+ * @private {boolean|undefined}
+ */
+var supportsPassive_ = void 0;
+
+/**
+ * @param {!Window} windowObj
+ * @return {boolean}
+ */
+function detectEdgePseudoVarBug(windowObj) {
+  // Detect versions of Edge with buggy var() support
+  // See: https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/11495448/
+  var document = windowObj.document;
+  var node = document.createElement('div');
+  node.className = 'mdc-ripple-surface--test-edge-var-bug';
+  document.body.appendChild(node);
+
+  // The bug exists if ::before style ends up propagating to the parent element.
+  // Additionally, getComputedStyle returns null in iframes with display: "none" in Firefox,
+  // but Firefox is known to support CSS custom properties correctly.
+  // See: https://bugzilla.mozilla.org/show_bug.cgi?id=548397
+  var computedStyle = windowObj.getComputedStyle(node);
+  var hasPseudoVarBug = computedStyle !== null && computedStyle.borderTopStyle === 'solid';
+  node.remove();
+  return hasPseudoVarBug;
+}
+
+/**
+ * @param {!Window} windowObj
+ * @param {boolean=} forceRefresh
+ * @return {boolean|undefined}
+ */
+
+function supportsCssVariables(windowObj) {
+  var forceRefresh = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+
+  var supportsCssVariables = supportsCssVariables_;
+  if (typeof supportsCssVariables_ === 'boolean' && !forceRefresh) {
+    return supportsCssVariables;
+  }
+
+  var supportsFunctionPresent = windowObj.CSS && typeof windowObj.CSS.supports === 'function';
+  if (!supportsFunctionPresent) {
+    return;
+  }
+
+  var explicitlySupportsCssVars = windowObj.CSS.supports('--css-vars', 'yes');
+  // See: https://bugs.webkit.org/show_bug.cgi?id=154669
+  // See: README section on Safari
+  var weAreFeatureDetectingSafari10plus = windowObj.CSS.supports('(--css-vars: yes)') && windowObj.CSS.supports('color', '#00000000');
+
+  if (explicitlySupportsCssVars || weAreFeatureDetectingSafari10plus) {
+    supportsCssVariables = !detectEdgePseudoVarBug(windowObj);
+  } else {
+    supportsCssVariables = false;
+  }
+
+  if (!forceRefresh) {
+    supportsCssVariables_ = supportsCssVariables;
+  }
+  return supportsCssVariables;
+}
+
+//
+/**
+ * Determine whether the current browser supports passive event listeners, and if so, use them.
+ * @param {!Window=} globalObj
+ * @param {boolean=} forceRefresh
+ * @return {boolean|{passive: boolean}}
+ */
+function applyPassive() {
+  var globalObj = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : window;
+  var forceRefresh = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+
+  if (supportsPassive_ === undefined || forceRefresh) {
+    var isSupported = false;
+    try {
+      globalObj.document.addEventListener('test', null, { get passive() {
+          isSupported = true;
+        } });
+    } catch (e) {}
+
+    supportsPassive_ = isSupported;
+  }
+
+  return supportsPassive_ ? { passive: true } : false;
+}
+
+/**
+ * @param {!Object} HTMLElementPrototype
+ * @return {!Array<string>}
+ */
+function getMatchesProperty(HTMLElementPrototype) {
+  return ['webkitMatchesSelector', 'msMatchesSelector', 'matches'].filter(function (p) {
+    return p in HTMLElementPrototype;
+  }).pop();
+}
+
+/**
+ * @param {!Event} ev
+ * @param {{x: number, y: number}} pageOffset
+ * @param {!ClientRect} clientRect
+ * @return {{x: number, y: number}}
+ */
+function getNormalizedEventCoords(ev, pageOffset, clientRect) {
+  var x = pageOffset.x,
+      y = pageOffset.y;
+
+  var documentX = x + clientRect.left;
+  var documentY = y + clientRect.top;
+
+  var normalizedX = void 0;
+  var normalizedY = void 0;
+  // Determine touch point relative to the ripple container.
+  if (ev.type === 'touchstart') {
+    normalizedX = ev.changedTouches[0].pageX - documentX;
+    normalizedY = ev.changedTouches[0].pageY - documentY;
+  } else {
+    normalizedX = ev.pageX - documentX;
+    normalizedY = ev.pageY - documentY;
+  }
+
+  return { x: normalizedX, y: normalizedY };
+}
+
+
+
+/***/ }),
+/* 3 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * @license
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/* eslint no-unused-vars: [2, {"args": "none"}] */
+
+/**
+ * Adapter for MDC Ripple. Provides an interface for managing
+ * - classes
+ * - dom
+ * - CSS variables
+ * - position
+ * - dimensions
+ * - scroll position
+ * - event handlers
+ * - unbounded, active and disabled states
+ *
+ * Additionally, provides type information for the adapter to the Closure
+ * compiler.
+ *
+ * Implement this adapter for your framework of choice to delegate updates to
+ * the component in your framework of choice. See architecture documentation
+ * for more details.
+ * https://github.com/material-components/material-components-web/blob/master/docs/code/architecture.md
+ *
+ * @record
+ */
+var MDCRippleAdapter = function () {
+  function MDCRippleAdapter() {
+    _classCallCheck(this, MDCRippleAdapter);
+  }
+
+  _createClass(MDCRippleAdapter, [{
+    key: "browserSupportsCssVars",
+
+    /** @return {boolean} */
+    value: function browserSupportsCssVars() {}
+
+    /** @return {boolean} */
+
+  }, {
+    key: "isUnbounded",
+    value: function isUnbounded() {}
+
+    /** @return {boolean} */
+
+  }, {
+    key: "isSurfaceActive",
+    value: function isSurfaceActive() {}
+
+    /** @return {boolean} */
+
+  }, {
+    key: "isSurfaceDisabled",
+    value: function isSurfaceDisabled() {}
+
+    /** @param {string} className */
+
+  }, {
+    key: "addClass",
+    value: function addClass(className) {}
+
+    /** @param {string} className */
+
+  }, {
+    key: "removeClass",
+    value: function removeClass(className) {}
+
+    /** @param {!EventTarget} target */
+
+  }, {
+    key: "containsEventTarget",
+    value: function containsEventTarget(target) {}
+
+    /**
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: "registerInteractionHandler",
+    value: function registerInteractionHandler(evtType, handler) {}
+
+    /**
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: "deregisterInteractionHandler",
+    value: function deregisterInteractionHandler(evtType, handler) {}
+
+    /**
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: "registerDocumentInteractionHandler",
+    value: function registerDocumentInteractionHandler(evtType, handler) {}
+
+    /**
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: "deregisterDocumentInteractionHandler",
+    value: function deregisterDocumentInteractionHandler(evtType, handler) {}
+
+    /**
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: "registerResizeHandler",
+    value: function registerResizeHandler(handler) {}
+
+    /**
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: "deregisterResizeHandler",
+    value: function deregisterResizeHandler(handler) {}
+
+    /**
+     * @param {string} varName
+     * @param {?number|string} value
+     */
+
+  }, {
+    key: "updateCssVariable",
+    value: function updateCssVariable(varName, value) {}
+
+    /** @return {!ClientRect} */
+
+  }, {
+    key: "computeBoundingRect",
+    value: function computeBoundingRect() {}
+
+    /** @return {{x: number, y: number}} */
+
+  }, {
+    key: "getWindowPageOffset",
+    value: function getWindowPageOffset() {}
+  }]);
+
+  return MDCRippleAdapter;
+}();
+
+/* unused harmony default export */ var _unused_webpack_default_export = (MDCRippleAdapter);
+
+/***/ }),
+/* 4 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MDCRipple", function() { return MDCRipple; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "RippleCapableSurface", function() { return RippleCapableSurface; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_component__ = __webpack_require__(1);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__adapter__ = __webpack_require__(3);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__foundation__ = __webpack_require__(5);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__util__ = __webpack_require__(2);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCRippleFoundation", function() { return __WEBPACK_IMPORTED_MODULE_2__foundation__["a"]; });
+/* harmony reexport (module object) */ __webpack_require__.d(__webpack_exports__, "util", function() { return __WEBPACK_IMPORTED_MODULE_3__util__; });
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * @license
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+/**
+ * @extends MDCComponent<!MDCRippleFoundation>
+ */
+
+var MDCRipple = function (_MDCComponent) {
+  _inherits(MDCRipple, _MDCComponent);
+
+  /** @param {...?} args */
+  function MDCRipple() {
+    var _ref;
+
+    _classCallCheck(this, MDCRipple);
+
+    for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    /** @type {boolean} */
+    var _this = _possibleConstructorReturn(this, (_ref = MDCRipple.__proto__ || Object.getPrototypeOf(MDCRipple)).call.apply(_ref, [this].concat(args)));
+
+    _this.disabled = false;
+
+    /** @private {boolean} */
+    _this.unbounded_;
+    return _this;
+  }
+
+  /**
+   * @param {!Element} root
+   * @param {{isUnbounded: (boolean|undefined)}=} options
+   * @return {!MDCRipple}
+   */
+
+
+  _createClass(MDCRipple, [{
+    key: 'setUnbounded_',
+
+
+    /**
+     * Closure Compiler throws an access control error when directly accessing a
+     * protected or private property inside a getter/setter, like unbounded above.
+     * By accessing the protected property inside a method, we solve that problem.
+     * That's why this function exists.
+     * @private
+     */
+    value: function setUnbounded_() {
+      this.foundation_.setUnbounded(this.unbounded_);
+    }
+  }, {
+    key: 'activate',
+    value: function activate() {
+      this.foundation_.activate();
+    }
+  }, {
+    key: 'deactivate',
+    value: function deactivate() {
+      this.foundation_.deactivate();
+    }
+  }, {
+    key: 'layout',
+    value: function layout() {
+      this.foundation_.layout();
+    }
+
+    /**
+     * @return {!MDCRippleFoundation}
+     * @override
+     */
+
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      return new __WEBPACK_IMPORTED_MODULE_2__foundation__["a" /* default */](MDCRipple.createAdapter(this));
+    }
+
+    /** @override */
+
+  }, {
+    key: 'initialSyncWithDOM',
+    value: function initialSyncWithDOM() {
+      this.unbounded = 'mdcRippleIsUnbounded' in this.root_.dataset;
+    }
+  }, {
+    key: 'unbounded',
+
+
+    /** @return {boolean} */
+    get: function get() {
+      return this.unbounded_;
+    }
+
+    /** @param {boolean} unbounded */
+    ,
+    set: function set(unbounded) {
+      this.unbounded_ = Boolean(unbounded);
+      this.setUnbounded_();
+    }
+  }], [{
+    key: 'attachTo',
+    value: function attachTo(root) {
+      var _ref2 = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
+          _ref2$isUnbounded = _ref2.isUnbounded,
+          isUnbounded = _ref2$isUnbounded === undefined ? undefined : _ref2$isUnbounded;
+
+      var ripple = new MDCRipple(root);
+      // Only override unbounded behavior if option is explicitly specified
+      if (isUnbounded !== undefined) {
+        ripple.unbounded = /** @type {boolean} */isUnbounded;
+      }
+      return ripple;
+    }
+
+    /**
+     * @param {!RippleCapableSurface} instance
+     * @return {!MDCRippleAdapter}
+     */
+
+  }, {
+    key: 'createAdapter',
+    value: function createAdapter(instance) {
+      var MATCHES = __WEBPACK_IMPORTED_MODULE_3__util__["getMatchesProperty"](HTMLElement.prototype);
+
+      return {
+        browserSupportsCssVars: function browserSupportsCssVars() {
+          return __WEBPACK_IMPORTED_MODULE_3__util__["supportsCssVariables"](window);
+        },
+        isUnbounded: function isUnbounded() {
+          return instance.unbounded;
+        },
+        isSurfaceActive: function isSurfaceActive() {
+          return instance.root_[MATCHES](':active');
+        },
+        isSurfaceDisabled: function isSurfaceDisabled() {
+          return instance.disabled;
+        },
+        addClass: function addClass(className) {
+          return instance.root_.classList.add(className);
+        },
+        removeClass: function removeClass(className) {
+          return instance.root_.classList.remove(className);
+        },
+        containsEventTarget: function containsEventTarget(target) {
+          return instance.root_.contains(target);
+        },
+        registerInteractionHandler: function registerInteractionHandler(evtType, handler) {
+          return instance.root_.addEventListener(evtType, handler, __WEBPACK_IMPORTED_MODULE_3__util__["applyPassive"]());
+        },
+        deregisterInteractionHandler: function deregisterInteractionHandler(evtType, handler) {
+          return instance.root_.removeEventListener(evtType, handler, __WEBPACK_IMPORTED_MODULE_3__util__["applyPassive"]());
+        },
+        registerDocumentInteractionHandler: function registerDocumentInteractionHandler(evtType, handler) {
+          return document.documentElement.addEventListener(evtType, handler, __WEBPACK_IMPORTED_MODULE_3__util__["applyPassive"]());
+        },
+        deregisterDocumentInteractionHandler: function deregisterDocumentInteractionHandler(evtType, handler) {
+          return document.documentElement.removeEventListener(evtType, handler, __WEBPACK_IMPORTED_MODULE_3__util__["applyPassive"]());
+        },
+        registerResizeHandler: function registerResizeHandler(handler) {
+          return window.addEventListener('resize', handler);
+        },
+        deregisterResizeHandler: function deregisterResizeHandler(handler) {
+          return window.removeEventListener('resize', handler);
+        },
+        updateCssVariable: function updateCssVariable(varName, value) {
+          return instance.root_.style.setProperty(varName, value);
+        },
+        computeBoundingRect: function computeBoundingRect() {
+          return instance.root_.getBoundingClientRect();
+        },
+        getWindowPageOffset: function getWindowPageOffset() {
+          return { x: window.pageXOffset, y: window.pageYOffset };
+        }
+      };
+    }
+  }]);
+
+  return MDCRipple;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_component__["a" /* default */]);
+
+/**
+ * See Material Design spec for more details on when to use ripples.
+ * https://material.io/guidelines/motion/choreography.html#choreography-creation
+ * @record
+ */
+
+
+var RippleCapableSurface = function RippleCapableSurface() {
+  _classCallCheck(this, RippleCapableSurface);
+};
+
+/** @protected {!Element} */
+
+
+RippleCapableSurface.prototype.root_;
+
+/**
+ * Whether or not the ripple bleeds out of the bounds of the element.
+ * @type {boolean|undefined}
+ */
+RippleCapableSurface.prototype.unbounded;
+
+/**
+ * Whether or not the ripple is attached to a disabled component.
+ * @type {boolean|undefined}
+ */
+RippleCapableSurface.prototype.disabled;
+
+
+
+/***/ }),
+/* 5 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_foundation__ = __webpack_require__(0);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__adapter__ = __webpack_require__(3);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__constants__ = __webpack_require__(6);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__util__ = __webpack_require__(2);
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * @license
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+/**
+ * @typedef {{
+ *   isActivated: (boolean|undefined),
+ *   hasDeactivationUXRun: (boolean|undefined),
+ *   wasActivatedByPointer: (boolean|undefined),
+ *   wasElementMadeActive: (boolean|undefined),
+ *   activationEvent: Event,
+ *   isProgrammatic: (boolean|undefined)
+ * }}
+ */
+var ActivationStateType = void 0;
+
+/**
+ * @typedef {{
+ *   activate: (string|undefined),
+ *   deactivate: (string|undefined),
+ *   focus: (string|undefined),
+ *   blur: (string|undefined)
+ * }}
+ */
+var ListenerInfoType = void 0;
+
+/**
+ * @typedef {{
+ *   activate: function(!Event),
+ *   deactivate: function(!Event),
+ *   focus: function(),
+ *   blur: function()
+ * }}
+ */
+var ListenersType = void 0;
+
+/**
+ * @typedef {{
+ *   x: number,
+ *   y: number
+ * }}
+ */
+var PointType = void 0;
+
+// Activation events registered on the root element of each instance for activation
+var ACTIVATION_EVENT_TYPES = ['touchstart', 'pointerdown', 'mousedown', 'keydown'];
+
+// Deactivation events registered on documentElement when a pointer-related down event occurs
+var POINTER_DEACTIVATION_EVENT_TYPES = ['touchend', 'pointerup', 'mouseup'];
+
+// Tracks activations that have occurred on the current frame, to avoid simultaneous nested activations
+/** @type {!Array<!EventTarget>} */
+var activatedTargets = [];
+
+/**
+ * @extends {MDCFoundation<!MDCRippleAdapter>}
+ */
+
+var MDCRippleFoundation = function (_MDCFoundation) {
+  _inherits(MDCRippleFoundation, _MDCFoundation);
+
+  _createClass(MDCRippleFoundation, null, [{
+    key: 'cssClasses',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */];
+    }
+  }, {
+    key: 'strings',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["c" /* strings */];
+    }
+  }, {
+    key: 'numbers',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["b" /* numbers */];
+    }
+  }, {
+    key: 'defaultAdapter',
+    get: function get() {
+      return {
+        browserSupportsCssVars: function browserSupportsCssVars() /* boolean - cached */{},
+        isUnbounded: function isUnbounded() /* boolean */{},
+        isSurfaceActive: function isSurfaceActive() /* boolean */{},
+        isSurfaceDisabled: function isSurfaceDisabled() /* boolean */{},
+        addClass: function addClass() /* className: string */{},
+        removeClass: function removeClass() /* className: string */{},
+        containsEventTarget: function containsEventTarget() /* target: !EventTarget */{},
+        registerInteractionHandler: function registerInteractionHandler() /* evtType: string, handler: EventListener */{},
+        deregisterInteractionHandler: function deregisterInteractionHandler() /* evtType: string, handler: EventListener */{},
+        registerDocumentInteractionHandler: function registerDocumentInteractionHandler() /* evtType: string, handler: EventListener */{},
+        deregisterDocumentInteractionHandler: function deregisterDocumentInteractionHandler() /* evtType: string, handler: EventListener */{},
+        registerResizeHandler: function registerResizeHandler() /* handler: EventListener */{},
+        deregisterResizeHandler: function deregisterResizeHandler() /* handler: EventListener */{},
+        updateCssVariable: function updateCssVariable() /* varName: string, value: string */{},
+        computeBoundingRect: function computeBoundingRect() /* ClientRect */{},
+        getWindowPageOffset: function getWindowPageOffset() /* {x: number, y: number} */{}
+      };
+    }
+  }]);
+
+  function MDCRippleFoundation(adapter) {
+    _classCallCheck(this, MDCRippleFoundation);
+
+    /** @private {number} */
+    var _this = _possibleConstructorReturn(this, (MDCRippleFoundation.__proto__ || Object.getPrototypeOf(MDCRippleFoundation)).call(this, _extends(MDCRippleFoundation.defaultAdapter, adapter)));
+
+    _this.layoutFrame_ = 0;
+
+    /** @private {!ClientRect} */
+    _this.frame_ = /** @type {!ClientRect} */{ width: 0, height: 0 };
+
+    /** @private {!ActivationStateType} */
+    _this.activationState_ = _this.defaultActivationState_();
+
+    /** @private {number} */
+    _this.initialSize_ = 0;
+
+    /** @private {number} */
+    _this.maxRadius_ = 0;
+
+    /** @private {function(!Event)} */
+    _this.activateHandler_ = function (e) {
+      return _this.activate_(e);
+    };
+
+    /** @private {function(!Event)} */
+    _this.deactivateHandler_ = function (e) {
+      return _this.deactivate_(e);
+    };
+
+    /** @private {function(?Event=)} */
+    _this.focusHandler_ = function () {
+      return _this.handleFocus();
+    };
+
+    /** @private {function(?Event=)} */
+    _this.blurHandler_ = function () {
+      return _this.handleBlur();
+    };
+
+    /** @private {!Function} */
+    _this.resizeHandler_ = function () {
+      return _this.layout();
+    };
+
+    /** @private {{left: number, top:number}} */
+    _this.unboundedCoords_ = {
+      left: 0,
+      top: 0
+    };
+
+    /** @private {number} */
+    _this.fgScale_ = 0;
+
+    /** @private {number} */
+    _this.activationTimer_ = 0;
+
+    /** @private {number} */
+    _this.fgDeactivationRemovalTimer_ = 0;
+
+    /** @private {boolean} */
+    _this.activationAnimationHasEnded_ = false;
+
+    /** @private {!Function} */
+    _this.activationTimerCallback_ = function () {
+      _this.activationAnimationHasEnded_ = true;
+      _this.runDeactivationUXLogicIfReady_();
+    };
+
+    /** @private {?Event} */
+    _this.previousActivationEvent_ = null;
+    return _this;
+  }
+
+  /**
+   * We compute this property so that we are not querying information about the client
+   * until the point in time where the foundation requests it. This prevents scenarios where
+   * client-side feature-detection may happen too early, such as when components are rendered on the server
+   * and then initialized at mount time on the client.
+   * @return {boolean}
+   * @private
+   */
+
+
+  _createClass(MDCRippleFoundation, [{
+    key: 'supportsPressRipple_',
+    value: function supportsPressRipple_() {
+      return this.adapter_.browserSupportsCssVars();
+    }
+
+    /**
+     * @return {!ActivationStateType}
+     */
+
+  }, {
+    key: 'defaultActivationState_',
+    value: function defaultActivationState_() {
+      return {
+        isActivated: false,
+        hasDeactivationUXRun: false,
+        wasActivatedByPointer: false,
+        wasElementMadeActive: false,
+        activationEvent: null,
+        isProgrammatic: false
+      };
+    }
+
+    /** @override */
+
+  }, {
+    key: 'init',
+    value: function init() {
+      var _this2 = this;
+
+      var supportsPressRipple = this.supportsPressRipple_();
+
+      this.registerRootHandlers_(supportsPressRipple);
+
+      if (supportsPressRipple) {
+        var _MDCRippleFoundation$ = MDCRippleFoundation.cssClasses,
+            ROOT = _MDCRippleFoundation$.ROOT,
+            UNBOUNDED = _MDCRippleFoundation$.UNBOUNDED;
+
+        requestAnimationFrame(function () {
+          _this2.adapter_.addClass(ROOT);
+          if (_this2.adapter_.isUnbounded()) {
+            _this2.adapter_.addClass(UNBOUNDED);
+            // Unbounded ripples need layout logic applied immediately to set coordinates for both shade and ripple
+            _this2.layoutInternal_();
+          }
+        });
+      }
+    }
+
+    /** @override */
+
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      var _this3 = this;
+
+      if (this.supportsPressRipple_()) {
+        if (this.activationTimer_) {
+          clearTimeout(this.activationTimer_);
+          this.activationTimer_ = 0;
+          var FG_ACTIVATION = MDCRippleFoundation.cssClasses.FG_ACTIVATION;
+
+          this.adapter_.removeClass(FG_ACTIVATION);
+        }
+
+        var _MDCRippleFoundation$2 = MDCRippleFoundation.cssClasses,
+            ROOT = _MDCRippleFoundation$2.ROOT,
+            UNBOUNDED = _MDCRippleFoundation$2.UNBOUNDED;
+
+        requestAnimationFrame(function () {
+          _this3.adapter_.removeClass(ROOT);
+          _this3.adapter_.removeClass(UNBOUNDED);
+          _this3.removeCssVars_();
+        });
+      }
+
+      this.deregisterRootHandlers_();
+      this.deregisterDeactivationHandlers_();
+    }
+
+    /**
+     * @param {boolean} supportsPressRipple Passed from init to save a redundant function call
+     * @private
+     */
+
+  }, {
+    key: 'registerRootHandlers_',
+    value: function registerRootHandlers_(supportsPressRipple) {
+      var _this4 = this;
+
+      if (supportsPressRipple) {
+        ACTIVATION_EVENT_TYPES.forEach(function (type) {
+          _this4.adapter_.registerInteractionHandler(type, _this4.activateHandler_);
+        });
+        if (this.adapter_.isUnbounded()) {
+          this.adapter_.registerResizeHandler(this.resizeHandler_);
+        }
+      }
+
+      this.adapter_.registerInteractionHandler('focus', this.focusHandler_);
+      this.adapter_.registerInteractionHandler('blur', this.blurHandler_);
+    }
+
+    /**
+     * @param {!Event} e
+     * @private
+     */
+
+  }, {
+    key: 'registerDeactivationHandlers_',
+    value: function registerDeactivationHandlers_(e) {
+      var _this5 = this;
+
+      if (e.type === 'keydown') {
+        this.adapter_.registerInteractionHandler('keyup', this.deactivateHandler_);
+      } else {
+        POINTER_DEACTIVATION_EVENT_TYPES.forEach(function (type) {
+          _this5.adapter_.registerDocumentInteractionHandler(type, _this5.deactivateHandler_);
+        });
+      }
+    }
+
+    /** @private */
+
+  }, {
+    key: 'deregisterRootHandlers_',
+    value: function deregisterRootHandlers_() {
+      var _this6 = this;
+
+      ACTIVATION_EVENT_TYPES.forEach(function (type) {
+        _this6.adapter_.deregisterInteractionHandler(type, _this6.activateHandler_);
+      });
+      this.adapter_.deregisterInteractionHandler('focus', this.focusHandler_);
+      this.adapter_.deregisterInteractionHandler('blur', this.blurHandler_);
+
+      if (this.adapter_.isUnbounded()) {
+        this.adapter_.deregisterResizeHandler(this.resizeHandler_);
+      }
+    }
+
+    /** @private */
+
+  }, {
+    key: 'deregisterDeactivationHandlers_',
+    value: function deregisterDeactivationHandlers_() {
+      var _this7 = this;
+
+      this.adapter_.deregisterInteractionHandler('keyup', this.deactivateHandler_);
+      POINTER_DEACTIVATION_EVENT_TYPES.forEach(function (type) {
+        _this7.adapter_.deregisterDocumentInteractionHandler(type, _this7.deactivateHandler_);
+      });
+    }
+
+    /** @private */
+
+  }, {
+    key: 'removeCssVars_',
+    value: function removeCssVars_() {
+      var _this8 = this;
+
+      var strings = MDCRippleFoundation.strings;
+
+      Object.keys(strings).forEach(function (k) {
+        if (k.indexOf('VAR_') === 0) {
+          _this8.adapter_.updateCssVariable(strings[k], null);
+        }
+      });
+    }
+
+    /**
+     * @param {?Event} e
+     * @private
+     */
+
+  }, {
+    key: 'activate_',
+    value: function activate_(e) {
+      var _this9 = this;
+
+      if (this.adapter_.isSurfaceDisabled()) {
+        return;
+      }
+
+      var activationState = this.activationState_;
+      if (activationState.isActivated) {
+        return;
+      }
+
+      // Avoid reacting to follow-on events fired by touch device after an already-processed user interaction
+      var previousActivationEvent = this.previousActivationEvent_;
+      var isSameInteraction = previousActivationEvent && e && previousActivationEvent.type !== e.type;
+      if (isSameInteraction) {
+        return;
+      }
+
+      activationState.isActivated = true;
+      activationState.isProgrammatic = e === null;
+      activationState.activationEvent = e;
+      activationState.wasActivatedByPointer = activationState.isProgrammatic ? false : e.type === 'mousedown' || e.type === 'touchstart' || e.type === 'pointerdown';
+
+      var hasActivatedChild = e && activatedTargets.length > 0 && activatedTargets.some(function (target) {
+        return _this9.adapter_.containsEventTarget(target);
+      });
+      if (hasActivatedChild) {
+        // Immediately reset activation state, while preserving logic that prevents touch follow-on events
+        this.resetActivationState_();
+        return;
+      }
+
+      if (e) {
+        activatedTargets.push( /** @type {!EventTarget} */e.target);
+        this.registerDeactivationHandlers_(e);
+      }
+
+      activationState.wasElementMadeActive = this.checkElementMadeActive_(e);
+      if (activationState.wasElementMadeActive) {
+        this.animateActivation_();
+      }
+
+      requestAnimationFrame(function () {
+        // Reset array on next frame after the current event has had a chance to bubble to prevent ancestor ripples
+        activatedTargets = [];
+
+        if (!activationState.wasElementMadeActive && (e.key === ' ' || e.keyCode === 32)) {
+          // If space was pressed, try again within an rAF call to detect :active, because different UAs report
+          // active states inconsistently when they're called within event handling code:
+          // - https://bugs.chromium.org/p/chromium/issues/detail?id=635971
+          // - https://bugzilla.mozilla.org/show_bug.cgi?id=1293741
+          // We try first outside rAF to support Edge, which does not exhibit this problem, but will crash if a CSS
+          // variable is set within a rAF callback for a submit button interaction (#2241).
+          activationState.wasElementMadeActive = _this9.checkElementMadeActive_(e);
+          if (activationState.wasElementMadeActive) {
+            _this9.animateActivation_();
+          }
+        }
+
+        if (!activationState.wasElementMadeActive) {
+          // Reset activation state immediately if element was not made active.
+          _this9.activationState_ = _this9.defaultActivationState_();
+        }
+      });
+    }
+
+    /**
+     * @param {?Event} e
+     * @private
+     */
+
+  }, {
+    key: 'checkElementMadeActive_',
+    value: function checkElementMadeActive_(e) {
+      return e && e.type === 'keydown' ? this.adapter_.isSurfaceActive() : true;
+    }
+
+    /**
+     * @param {?Event=} event Optional event containing position information.
+     */
+
+  }, {
+    key: 'activate',
+    value: function activate() {
+      var event = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
+
+      this.activate_(event);
+    }
+
+    /** @private */
+
+  }, {
+    key: 'animateActivation_',
+    value: function animateActivation_() {
+      var _this10 = this;
+
+      var _MDCRippleFoundation$3 = MDCRippleFoundation.strings,
+          VAR_FG_TRANSLATE_START = _MDCRippleFoundation$3.VAR_FG_TRANSLATE_START,
+          VAR_FG_TRANSLATE_END = _MDCRippleFoundation$3.VAR_FG_TRANSLATE_END;
+      var _MDCRippleFoundation$4 = MDCRippleFoundation.cssClasses,
+          FG_DEACTIVATION = _MDCRippleFoundation$4.FG_DEACTIVATION,
+          FG_ACTIVATION = _MDCRippleFoundation$4.FG_ACTIVATION;
+      var DEACTIVATION_TIMEOUT_MS = MDCRippleFoundation.numbers.DEACTIVATION_TIMEOUT_MS;
+
+
+      this.layoutInternal_();
+
+      var translateStart = '';
+      var translateEnd = '';
+
+      if (!this.adapter_.isUnbounded()) {
+        var _getFgTranslationCoor = this.getFgTranslationCoordinates_(),
+            startPoint = _getFgTranslationCoor.startPoint,
+            endPoint = _getFgTranslationCoor.endPoint;
+
+        translateStart = startPoint.x + 'px, ' + startPoint.y + 'px';
+        translateEnd = endPoint.x + 'px, ' + endPoint.y + 'px';
+      }
+
+      this.adapter_.updateCssVariable(VAR_FG_TRANSLATE_START, translateStart);
+      this.adapter_.updateCssVariable(VAR_FG_TRANSLATE_END, translateEnd);
+      // Cancel any ongoing activation/deactivation animations
+      clearTimeout(this.activationTimer_);
+      clearTimeout(this.fgDeactivationRemovalTimer_);
+      this.rmBoundedActivationClasses_();
+      this.adapter_.removeClass(FG_DEACTIVATION);
+
+      // Force layout in order to re-trigger the animation.
+      this.adapter_.computeBoundingRect();
+      this.adapter_.addClass(FG_ACTIVATION);
+      this.activationTimer_ = setTimeout(function () {
+        return _this10.activationTimerCallback_();
+      }, DEACTIVATION_TIMEOUT_MS);
+    }
+
+    /**
+     * @private
+     * @return {{startPoint: PointType, endPoint: PointType}}
+     */
+
+  }, {
+    key: 'getFgTranslationCoordinates_',
+    value: function getFgTranslationCoordinates_() {
+      var _activationState_ = this.activationState_,
+          activationEvent = _activationState_.activationEvent,
+          wasActivatedByPointer = _activationState_.wasActivatedByPointer;
+
+
+      var startPoint = void 0;
+      if (wasActivatedByPointer) {
+        startPoint = Object(__WEBPACK_IMPORTED_MODULE_3__util__["getNormalizedEventCoords"])(
+        /** @type {!Event} */activationEvent, this.adapter_.getWindowPageOffset(), this.adapter_.computeBoundingRect());
+      } else {
+        startPoint = {
+          x: this.frame_.width / 2,
+          y: this.frame_.height / 2
+        };
+      }
+      // Center the element around the start point.
+      startPoint = {
+        x: startPoint.x - this.initialSize_ / 2,
+        y: startPoint.y - this.initialSize_ / 2
+      };
+
+      var endPoint = {
+        x: this.frame_.width / 2 - this.initialSize_ / 2,
+        y: this.frame_.height / 2 - this.initialSize_ / 2
+      };
+
+      return { startPoint: startPoint, endPoint: endPoint };
+    }
+
+    /** @private */
+
+  }, {
+    key: 'runDeactivationUXLogicIfReady_',
+    value: function runDeactivationUXLogicIfReady_() {
+      var _this11 = this;
+
+      // This method is called both when a pointing device is released, and when the activation animation ends.
+      // The deactivation animation should only run after both of those occur.
+      var FG_DEACTIVATION = MDCRippleFoundation.cssClasses.FG_DEACTIVATION;
+      var _activationState_2 = this.activationState_,
+          hasDeactivationUXRun = _activationState_2.hasDeactivationUXRun,
+          isActivated = _activationState_2.isActivated;
+
+      var activationHasEnded = hasDeactivationUXRun || !isActivated;
+
+      if (activationHasEnded && this.activationAnimationHasEnded_) {
+        this.rmBoundedActivationClasses_();
+        this.adapter_.addClass(FG_DEACTIVATION);
+        this.fgDeactivationRemovalTimer_ = setTimeout(function () {
+          _this11.adapter_.removeClass(FG_DEACTIVATION);
+        }, __WEBPACK_IMPORTED_MODULE_2__constants__["b" /* numbers */].FG_DEACTIVATION_MS);
+      }
+    }
+
+    /** @private */
+
+  }, {
+    key: 'rmBoundedActivationClasses_',
+    value: function rmBoundedActivationClasses_() {
+      var FG_ACTIVATION = MDCRippleFoundation.cssClasses.FG_ACTIVATION;
+
+      this.adapter_.removeClass(FG_ACTIVATION);
+      this.activationAnimationHasEnded_ = false;
+      this.adapter_.computeBoundingRect();
+    }
+  }, {
+    key: 'resetActivationState_',
+    value: function resetActivationState_() {
+      var _this12 = this;
+
+      this.previousActivationEvent_ = this.activationState_.activationEvent;
+      this.activationState_ = this.defaultActivationState_();
+      // Touch devices may fire additional events for the same interaction within a short time.
+      // Store the previous event until it's safe to assume that subsequent events are for new interactions.
+      setTimeout(function () {
+        return _this12.previousActivationEvent_ = null;
+      }, MDCRippleFoundation.numbers.TAP_DELAY_MS);
+    }
+
+    /**
+     * @param {?Event} e
+     * @private
+     */
+
+  }, {
+    key: 'deactivate_',
+    value: function deactivate_(e) {
+      var _this13 = this;
+
+      var activationState = this.activationState_;
+      // This can happen in scenarios such as when you have a keyup event that blurs the element.
+      if (!activationState.isActivated) {
+        return;
+      }
+
+      var state = /** @type {!ActivationStateType} */_extends({}, activationState);
+
+      if (activationState.isProgrammatic) {
+        var evtObject = null;
+        requestAnimationFrame(function () {
+          return _this13.animateDeactivation_(evtObject, state);
+        });
+        this.resetActivationState_();
+      } else {
+        this.deregisterDeactivationHandlers_();
+        requestAnimationFrame(function () {
+          _this13.activationState_.hasDeactivationUXRun = true;
+          _this13.animateDeactivation_(e, state);
+          _this13.resetActivationState_();
+        });
+      }
+    }
+
+    /**
+     * @param {?Event=} event Optional event containing position information.
+     */
+
+  }, {
+    key: 'deactivate',
+    value: function deactivate() {
+      var event = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
+
+      this.deactivate_(event);
+    }
+
+    /**
+     * @param {Event} e
+     * @param {!ActivationStateType} options
+     * @private
+     */
+
+  }, {
+    key: 'animateDeactivation_',
+    value: function animateDeactivation_(e, _ref) {
+      var wasActivatedByPointer = _ref.wasActivatedByPointer,
+          wasElementMadeActive = _ref.wasElementMadeActive;
+
+      if (wasActivatedByPointer || wasElementMadeActive) {
+        this.runDeactivationUXLogicIfReady_();
+      }
+    }
+  }, {
+    key: 'layout',
+    value: function layout() {
+      var _this14 = this;
+
+      if (this.layoutFrame_) {
+        cancelAnimationFrame(this.layoutFrame_);
+      }
+      this.layoutFrame_ = requestAnimationFrame(function () {
+        _this14.layoutInternal_();
+        _this14.layoutFrame_ = 0;
+      });
+    }
+
+    /** @private */
+
+  }, {
+    key: 'layoutInternal_',
+    value: function layoutInternal_() {
+      var _this15 = this;
+
+      this.frame_ = this.adapter_.computeBoundingRect();
+      var maxDim = Math.max(this.frame_.height, this.frame_.width);
+
+      // Surface diameter is treated differently for unbounded vs. bounded ripples.
+      // Unbounded ripple diameter is calculated smaller since the surface is expected to already be padded appropriately
+      // to extend the hitbox, and the ripple is expected to meet the edges of the padded hitbox (which is typically
+      // square). Bounded ripples, on the other hand, are fully expected to expand beyond the surface's longest diameter
+      // (calculated based on the diagonal plus a constant padding), and are clipped at the surface's border via
+      // `overflow: hidden`.
+      var getBoundedRadius = function getBoundedRadius() {
+        var hypotenuse = Math.sqrt(Math.pow(_this15.frame_.width, 2) + Math.pow(_this15.frame_.height, 2));
+        return hypotenuse + MDCRippleFoundation.numbers.PADDING;
+      };
+
+      this.maxRadius_ = this.adapter_.isUnbounded() ? maxDim : getBoundedRadius();
+
+      // Ripple is sized as a fraction of the largest dimension of the surface, then scales up using a CSS scale transform
+      this.initialSize_ = maxDim * MDCRippleFoundation.numbers.INITIAL_ORIGIN_SCALE;
+      this.fgScale_ = this.maxRadius_ / this.initialSize_;
+
+      this.updateLayoutCssVars_();
+    }
+
+    /** @private */
+
+  }, {
+    key: 'updateLayoutCssVars_',
+    value: function updateLayoutCssVars_() {
+      var _MDCRippleFoundation$5 = MDCRippleFoundation.strings,
+          VAR_FG_SIZE = _MDCRippleFoundation$5.VAR_FG_SIZE,
+          VAR_LEFT = _MDCRippleFoundation$5.VAR_LEFT,
+          VAR_TOP = _MDCRippleFoundation$5.VAR_TOP,
+          VAR_FG_SCALE = _MDCRippleFoundation$5.VAR_FG_SCALE;
+
+
+      this.adapter_.updateCssVariable(VAR_FG_SIZE, this.initialSize_ + 'px');
+      this.adapter_.updateCssVariable(VAR_FG_SCALE, this.fgScale_);
+
+      if (this.adapter_.isUnbounded()) {
+        this.unboundedCoords_ = {
+          left: Math.round(this.frame_.width / 2 - this.initialSize_ / 2),
+          top: Math.round(this.frame_.height / 2 - this.initialSize_ / 2)
+        };
+
+        this.adapter_.updateCssVariable(VAR_LEFT, this.unboundedCoords_.left + 'px');
+        this.adapter_.updateCssVariable(VAR_TOP, this.unboundedCoords_.top + 'px');
+      }
+    }
+
+    /** @param {boolean} unbounded */
+
+  }, {
+    key: 'setUnbounded',
+    value: function setUnbounded(unbounded) {
+      var UNBOUNDED = MDCRippleFoundation.cssClasses.UNBOUNDED;
+
+      if (unbounded) {
+        this.adapter_.addClass(UNBOUNDED);
+      } else {
+        this.adapter_.removeClass(UNBOUNDED);
+      }
+    }
+  }, {
+    key: 'handleFocus',
+    value: function handleFocus() {
+      var _this16 = this;
+
+      requestAnimationFrame(function () {
+        return _this16.adapter_.addClass(MDCRippleFoundation.cssClasses.BG_FOCUSED);
+      });
+    }
+  }, {
+    key: 'handleBlur',
+    value: function handleBlur() {
+      var _this17 = this;
+
+      requestAnimationFrame(function () {
+        return _this17.adapter_.removeClass(MDCRippleFoundation.cssClasses.BG_FOCUSED);
+      });
+    }
+  }]);
+
+  return MDCRippleFoundation;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_foundation__["a" /* default */]);
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCRippleFoundation);
+
+/***/ }),
+/* 6 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return cssClasses; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "c", function() { return strings; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return numbers; });
+/**
+ * @license
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+var cssClasses = {
+  // Ripple is a special case where the "root" component is really a "mixin" of sorts,
+  // given that it's an 'upgrade' to an existing component. That being said it is the root
+  // CSS class that all other CSS classes derive from.
+  ROOT: 'mdc-ripple-upgraded',
+  UNBOUNDED: 'mdc-ripple-upgraded--unbounded',
+  BG_FOCUSED: 'mdc-ripple-upgraded--background-focused',
+  FG_ACTIVATION: 'mdc-ripple-upgraded--foreground-activation',
+  FG_DEACTIVATION: 'mdc-ripple-upgraded--foreground-deactivation'
+};
+
+var strings = {
+  VAR_LEFT: '--mdc-ripple-left',
+  VAR_TOP: '--mdc-ripple-top',
+  VAR_FG_SIZE: '--mdc-ripple-fg-size',
+  VAR_FG_SCALE: '--mdc-ripple-fg-scale',
+  VAR_FG_TRANSLATE_START: '--mdc-ripple-fg-translate-start',
+  VAR_FG_TRANSLATE_END: '--mdc-ripple-fg-translate-end'
+};
+
+var numbers = {
+  PADDING: 10,
+  INITIAL_ORIGIN_SCALE: 0.6,
+  DEACTIVATION_TIMEOUT_MS: 225, // Corresponds to $mdc-ripple-translate-duration (i.e. activation animation duration)
+  FG_DEACTIVATION_MS: 150, // Corresponds to $mdc-ripple-fade-out-duration (i.e. deactivation animation duration)
+  TAP_DELAY_MS: 300 };
+
+
+
+/***/ })
+/******/ ]);
+});
+//# sourceMappingURL=mdc.ripple.js.map
\ No newline at end of file
diff --git a/node_modules/@material/textfield/node_modules/@material/ripple/dist/mdc.ripple.min.css b/node_modules/@material/textfield/node_modules/@material/ripple/dist/mdc.ripple.min.css
new file mode 100644
index 0000000..26a0ba4
--- /dev/null
+++ b/node_modules/@material/textfield/node_modules/@material/ripple/dist/mdc.ripple.min.css
@@ -0,0 +1,8 @@
+/*!
+ Material Components for the Web
+ Copyright (c) 2018 Google Inc.
+ License: Apache-2.0
+*/
+@-webkit-keyframes mdc-ripple-fg-radius-in{from{-webkit-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-transform:translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);transform:translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1)}to{-webkit-transform:translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));transform:translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1))}}@keyframes mdc-ripple-fg-radius-in{from{-webkit-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-transform:translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);transform:translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1)}to{-webkit-transform:translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));transform:translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1))}}@-webkit-keyframes mdc-ripple-fg-opacity-in{from{-webkit-animation-timing-function:linear;animation-timing-function:linear;opacity:0}to{opacity:var(--mdc-ripple-fg-opacity, 0)}}@keyframes mdc-ripple-fg-opacity-in{from{-webkit-animation-timing-function:linear;animation-timing-function:linear;opacity:0}to{opacity:var(--mdc-ripple-fg-opacity, 0)}}@-webkit-keyframes mdc-ripple-fg-opacity-out{from{-webkit-animation-timing-function:linear;animation-timing-function:linear;opacity:var(--mdc-ripple-fg-opacity, 0)}to{opacity:0}}@keyframes mdc-ripple-fg-opacity-out{from{-webkit-animation-timing-function:linear;animation-timing-function:linear;opacity:var(--mdc-ripple-fg-opacity, 0)}to{opacity:0}}.mdc-ripple-surface--test-edge-var-bug{--mdc-ripple-surface-test-edge-var: 1px solid #000;visibility:hidden}.mdc-ripple-surface--test-edge-var-bug::before{border:var(--mdc-ripple-surface-test-edge-var)}.mdc-ripple-surface{--mdc-ripple-fg-size: 0;--mdc-ripple-left: 0;--mdc-ripple-top: 0;--mdc-ripple-fg-scale: 1;--mdc-ripple-fg-translate-end: 0;--mdc-ripple-fg-translate-start: 0;-webkit-tap-highlight-color:rgba(0,0,0,0);will-change:transform, opacity;position:relative;outline:none;overflow:hidden}.mdc-ripple-surface::before,.mdc-ripple-surface::after{position:absolute;border-radius:50%;opacity:0;pointer-events:none;content:""}.mdc-ripple-surface::before{transition:opacity 15ms linear;z-index:1}.mdc-ripple-surface.mdc-ripple-upgraded::before{-webkit-transform:scale(var(--mdc-ripple-fg-scale, 1));transform:scale(var(--mdc-ripple-fg-scale, 1))}.mdc-ripple-surface.mdc-ripple-upgraded::after{top:0;left:0;-webkit-transform:scale(0);transform:scale(0);-webkit-transform-origin:center center;transform-origin:center center}.mdc-ripple-surface.mdc-ripple-upgraded--unbounded::after{top:var(--mdc-ripple-top, 0);left:var(--mdc-ripple-left, 0)}.mdc-ripple-surface.mdc-ripple-upgraded--foreground-activation::after{-webkit-animation:225ms mdc-ripple-fg-radius-in forwards,75ms mdc-ripple-fg-opacity-in forwards;animation:225ms mdc-ripple-fg-radius-in forwards,75ms mdc-ripple-fg-opacity-in forwards}.mdc-ripple-surface.mdc-ripple-upgraded--foreground-deactivation::after{-webkit-animation:150ms mdc-ripple-fg-opacity-out;animation:150ms mdc-ripple-fg-opacity-out;-webkit-transform:translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));transform:translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1))}.mdc-ripple-surface::before,.mdc-ripple-surface::after{background-color:#000}.mdc-ripple-surface:hover::before{opacity:.04}.mdc-ripple-surface:not(.mdc-ripple-upgraded):focus::before,.mdc-ripple-surface.mdc-ripple-upgraded--background-focused::before{transition-duration:75ms;opacity:.12}.mdc-ripple-surface:not(.mdc-ripple-upgraded)::after{transition:opacity 150ms linear}.mdc-ripple-surface:not(.mdc-ripple-upgraded):active::after{transition-duration:75ms;opacity:.16}.mdc-ripple-surface.mdc-ripple-upgraded{--mdc-ripple-fg-opacity: .16}.mdc-ripple-surface::before,.mdc-ripple-surface::after{top:calc(50% - 100%);left:calc(50% - 100%);width:200%;height:200%}.mdc-ripple-surface.mdc-ripple-upgraded::after{width:var(--mdc-ripple-fg-size, 100%);height:var(--mdc-ripple-fg-size, 100%)}.mdc-ripple-surface[data-mdc-ripple-is-unbounded]{overflow:visible}.mdc-ripple-surface[data-mdc-ripple-is-unbounded]::before,.mdc-ripple-surface[data-mdc-ripple-is-unbounded]::after{top:calc(50% - 50%);left:calc(50% - 50%);width:100%;height:100%}.mdc-ripple-surface[data-mdc-ripple-is-unbounded].mdc-ripple-upgraded::before,.mdc-ripple-surface[data-mdc-ripple-is-unbounded].mdc-ripple-upgraded::after{top:var(--mdc-ripple-top, calc(50% - 50%));left:var(--mdc-ripple-left, calc(50% - 50%));width:var(--mdc-ripple-fg-size, 100%);height:var(--mdc-ripple-fg-size, 100%)}.mdc-ripple-surface[data-mdc-ripple-is-unbounded].mdc-ripple-upgraded::after{width:var(--mdc-ripple-fg-size, 100%);height:var(--mdc-ripple-fg-size, 100%)}.mdc-ripple-surface--primary::before,.mdc-ripple-surface--primary::after{background-color:#6200ee}@supports not (-ms-ime-align: auto){.mdc-ripple-surface--primary::before,.mdc-ripple-surface--primary::after{background-color:var(--mdc-theme-primary, #6200ee)}}.mdc-ripple-surface--primary:hover::before{opacity:.04}.mdc-ripple-surface--primary:not(.mdc-ripple-upgraded):focus::before,.mdc-ripple-surface--primary.mdc-ripple-upgraded--background-focused::before{transition-duration:75ms;opacity:.12}.mdc-ripple-surface--primary:not(.mdc-ripple-upgraded)::after{transition:opacity 150ms linear}.mdc-ripple-surface--primary:not(.mdc-ripple-upgraded):active::after{transition-duration:75ms;opacity:.16}.mdc-ripple-surface--primary.mdc-ripple-upgraded{--mdc-ripple-fg-opacity: .16}.mdc-ripple-surface--accent::before,.mdc-ripple-surface--accent::after{background-color:#018786}@supports not (-ms-ime-align: auto){.mdc-ripple-surface--accent::before,.mdc-ripple-surface--accent::after{background-color:var(--mdc-theme-secondary, #018786)}}.mdc-ripple-surface--accent:hover::before{opacity:.04}.mdc-ripple-surface--accent:not(.mdc-ripple-upgraded):focus::before,.mdc-ripple-surface--accent.mdc-ripple-upgraded--background-focused::before{transition-duration:75ms;opacity:.12}.mdc-ripple-surface--accent:not(.mdc-ripple-upgraded)::after{transition:opacity 150ms linear}.mdc-ripple-surface--accent:not(.mdc-ripple-upgraded):active::after{transition-duration:75ms;opacity:.16}.mdc-ripple-surface--accent.mdc-ripple-upgraded{--mdc-ripple-fg-opacity: .16}
+
+/*# sourceMappingURL=mdc.ripple.min.css.map*/
\ No newline at end of file
diff --git a/node_modules/@material/textfield/node_modules/@material/ripple/dist/mdc.ripple.min.js b/node_modules/@material/textfield/node_modules/@material/ripple/dist/mdc.ripple.min.js
new file mode 100644
index 0000000..7a58bc2
--- /dev/null
+++ b/node_modules/@material/textfield/node_modules/@material/ripple/dist/mdc.ripple.min.js
@@ -0,0 +1,39 @@
+/*!
+ Material Components for the Web
+ Copyright (c) 2018 Google Inc.
+ License: Apache-2.0
+*/
+!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define([],e):"object"==typeof exports?exports.ripple=e():(t.mdc=t.mdc||{},t.mdc.ripple=e())}(this,function(){return function(t){function e(i){if(n[i])return n[i].exports;var a=n[i]={i:i,l:!1,exports:{}};return t[i].call(a.exports,a,a.exports,e),a.l=!0,a.exports}var n={};return e.m=t,e.c=n,e.d=function(t,n,i){e.o(t,n)||Object.defineProperty(t,n,{configurable:!1,enumerable:!0,get:i})},e.n=function(t){var n=t&&t.__esModule?function(){return t.default}:function(){return t};return e.d(n,"a",n),n},e.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},e.p="",e(e.s=4)}([function(t,e,n){"use strict";function i(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}var a=function(){function t(t,e){for(var n=0;n<e.length;n++){var i=e[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}return function(e,n,i){return n&&t(e.prototype,n),i&&t(e,i),e}}(),r=function(){function t(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};i(this,t),this.adapter_=e}return a(t,null,[{key:"cssClasses",get:function(){return{}}},{key:"strings",get:function(){return{}}},{key:"numbers",get:function(){return{}}},{key:"defaultAdapter",get:function(){return{}}}]),a(t,[{key:"init",value:function(){}},{key:"destroy",value:function(){}}]),t}();e.a=r},function(t,e,n){"use strict";function i(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}var a=n(0),r=function(){function t(t,e){for(var n=0;n<e.length;n++){var i=e[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}return function(e,n,i){return n&&t(e.prototype,n),i&&t(e,i),e}}(),o=function(){function t(e){var n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:void 0;i(this,t),this.root_=e;for(var a=arguments.length,r=Array(a>2?a-2:0),o=2;o<a;o++)r[o-2]=arguments[o];this.initialize.apply(this,r),this.foundation_=void 0===n?this.getDefaultFoundation():n,this.foundation_.init(),this.initialSyncWithDOM()}return r(t,null,[{key:"attachTo",value:function(e){return new t(e,new a.a)}}]),r(t,[{key:"initialize",value:function(){}},{key:"getDefaultFoundation",value:function(){throw new Error("Subclasses must override getDefaultFoundation to return a properly configured foundation class")}},{key:"initialSyncWithDOM",value:function(){}},{key:"destroy",value:function(){this.foundation_.destroy()}},{key:"listen",value:function(t,e){this.root_.addEventListener(t,e)}},{key:"unlisten",value:function(t,e){this.root_.removeEventListener(t,e)}},{key:"emit",value:function(t,e){var n=arguments.length>2&&void 0!==arguments[2]&&arguments[2],i=void 0;"function"==typeof CustomEvent?i=new CustomEvent(t,{detail:e,bubbles:n}):(i=document.createEvent("CustomEvent"),i.initCustomEvent(t,n,!1,e)),this.root_.dispatchEvent(i)}}]),t}();e.a=o},function(t,e,n){"use strict";function i(t){var e=t.document,n=e.createElement("div");n.className="mdc-ripple-surface--test-edge-var-bug",e.body.appendChild(n);var i=t.getComputedStyle(n),a=null!==i&&"solid"===i.borderTopStyle;return n.remove(),a}function a(t){var e=arguments.length>1&&void 0!==arguments[1]&&arguments[1],n=u;if("boolean"==typeof u&&!e)return n;if(t.CSS&&"function"==typeof t.CSS.supports){var a=t.CSS.supports("--css-vars","yes"),r=t.CSS.supports("(--css-vars: yes)")&&t.CSS.supports("color","#00000000");return n=!(!a&&!r||i(t)),e||(u=n),n}}function r(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:window,e=arguments.length>1&&void 0!==arguments[1]&&arguments[1];if(void 0===c||e){var n=!1;try{t.document.addEventListener("test",null,{get passive(){n=!0}})}catch(t){}c=n}return!!c&&{passive:!0}}function o(t){return["webkitMatchesSelector","msMatchesSelector","matches"].filter(function(e){return e in t}).pop()}function s(t,e,n){var i=e.x,a=e.y,r=i+n.left,o=a+n.top,s=void 0,u=void 0;return"touchstart"===t.type?(s=t.changedTouches[0].pageX-r,u=t.changedTouches[0].pageY-o):(s=t.pageX-r,u=t.pageY-o),{x:s,y:u}}Object.defineProperty(e,"__esModule",{value:!0}),n.d(e,"supportsCssVariables",function(){return a}),n.d(e,"applyPassive",function(){return r}),n.d(e,"getMatchesProperty",function(){return o}),n.d(e,"getNormalizedEventCoords",function(){return s});/**
+ * @license
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+var u=void 0,c=void 0},function(t,e,n){"use strict";function i(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}var a=function(){function t(t,e){for(var n=0;n<e.length;n++){var i=e[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}return function(e,n,i){return n&&t(e.prototype,n),i&&t(e,i),e}}();!function(){function t(){i(this,t)}a(t,[{key:"browserSupportsCssVars",value:function(){}},{key:"isUnbounded",value:function(){}},{key:"isSurfaceActive",value:function(){}},{key:"isSurfaceDisabled",value:function(){}},{key:"addClass",value:function(t){}},{key:"removeClass",value:function(t){}},{key:"containsEventTarget",value:function(t){}},{key:"registerInteractionHandler",value:function(t,e){}},{key:"deregisterInteractionHandler",value:function(t,e){}},{key:"registerDocumentInteractionHandler",value:function(t,e){}},{key:"deregisterDocumentInteractionHandler",value:function(t,e){}},{key:"registerResizeHandler",value:function(t){}},{key:"deregisterResizeHandler",value:function(t){}},{key:"updateCssVariable",value:function(t,e){}},{key:"computeBoundingRect",value:function(){}},{key:"getWindowPageOffset",value:function(){}}])}()},function(t,e,n){"use strict";function i(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function a(t,e){if(!t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!e||"object"!=typeof e&&"function"!=typeof e?t:e}function r(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),e&&(Object.setPrototypeOf?Object.setPrototypeOf(t,e):t.__proto__=e)}Object.defineProperty(e,"__esModule",{value:!0}),n.d(e,"MDCRipple",function(){return d}),n.d(e,"RippleCapableSurface",function(){return l});var o=n(1),s=(n(3),n(5)),u=n(2);n.d(e,"MDCRippleFoundation",function(){return s.a}),n.d(e,"util",function(){return u});var c=function(){function t(t,e){for(var n=0;n<e.length;n++){var i=e[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}return function(e,n,i){return n&&t(e.prototype,n),i&&t(e,i),e}}(),d=function(t){function e(){var t;i(this,e);for(var n=arguments.length,r=Array(n),o=0;o<n;o++)r[o]=arguments[o];var s=a(this,(t=e.__proto__||Object.getPrototypeOf(e)).call.apply(t,[this].concat(r)));return s.disabled=!1,s.unbounded_,s}return r(e,t),c(e,[{key:"setUnbounded_",value:function(){this.foundation_.setUnbounded(this.unbounded_)}},{key:"activate",value:function(){this.foundation_.activate()}},{key:"deactivate",value:function(){this.foundation_.deactivate()}},{key:"layout",value:function(){this.foundation_.layout()}},{key:"getDefaultFoundation",value:function(){return new s.a(e.createAdapter(this))}},{key:"initialSyncWithDOM",value:function(){this.unbounded="mdcRippleIsUnbounded"in this.root_.dataset}},{key:"unbounded",get:function(){return this.unbounded_},set:function(t){this.unbounded_=Boolean(t),this.setUnbounded_()}}],[{key:"attachTo",value:function(t){var n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},i=n.isUnbounded,a=void 0===i?void 0:i,r=new e(t);return void 0!==a&&(r.unbounded=a),r}},{key:"createAdapter",value:function(t){var e=u.getMatchesProperty(HTMLElement.prototype);return{browserSupportsCssVars:function(){return u.supportsCssVariables(window)},isUnbounded:function(){return t.unbounded},isSurfaceActive:function(){return t.root_[e](":active")},isSurfaceDisabled:function(){return t.disabled},addClass:function(e){return t.root_.classList.add(e)},removeClass:function(e){return t.root_.classList.remove(e)},containsEventTarget:function(e){return t.root_.contains(e)},registerInteractionHandler:function(e,n){return t.root_.addEventListener(e,n,u.applyPassive())},deregisterInteractionHandler:function(e,n){return t.root_.removeEventListener(e,n,u.applyPassive())},registerDocumentInteractionHandler:function(t,e){return document.documentElement.addEventListener(t,e,u.applyPassive())},deregisterDocumentInteractionHandler:function(t,e){return document.documentElement.removeEventListener(t,e,u.applyPassive())},registerResizeHandler:function(t){return window.addEventListener("resize",t)},deregisterResizeHandler:function(t){return window.removeEventListener("resize",t)},updateCssVariable:function(e,n){return t.root_.style.setProperty(e,n)},computeBoundingRect:function(){return t.root_.getBoundingClientRect()},getWindowPageOffset:function(){return{x:window.pageXOffset,y:window.pageYOffset}}}}}]),e}(o.a),l=function t(){i(this,t)};l.prototype.root_,l.prototype.unbounded,l.prototype.disabled},function(t,e,n){"use strict";function i(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function a(t,e){if(!t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!e||"object"!=typeof e&&"function"!=typeof e?t:e}function r(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),e&&(Object.setPrototypeOf?Object.setPrototypeOf(t,e):t.__proto__=e)}var o=n(0),s=(n(3),n(6)),u=n(2),c=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&(t[i]=n[i])}return t},d=function(){function t(t,e){for(var n=0;n<e.length;n++){var i=e[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}return function(e,n,i){return n&&t(e.prototype,n),i&&t(e,i),e}}(),l=["touchstart","pointerdown","mousedown","keydown"],f=["touchend","pointerup","mouseup"],v=[],p=function(t){function e(t){i(this,e);var n=a(this,(e.__proto__||Object.getPrototypeOf(e)).call(this,c(e.defaultAdapter,t)));return n.layoutFrame_=0,n.frame_={width:0,height:0},n.activationState_=n.defaultActivationState_(),n.initialSize_=0,n.maxRadius_=0,n.activateHandler_=function(t){return n.activate_(t)},n.deactivateHandler_=function(t){return n.deactivate_(t)},n.focusHandler_=function(){return n.handleFocus()},n.blurHandler_=function(){return n.handleBlur()},n.resizeHandler_=function(){return n.layout()},n.unboundedCoords_={left:0,top:0},n.fgScale_=0,n.activationTimer_=0,n.fgDeactivationRemovalTimer_=0,n.activationAnimationHasEnded_=!1,n.activationTimerCallback_=function(){n.activationAnimationHasEnded_=!0,n.runDeactivationUXLogicIfReady_()},n.previousActivationEvent_=null,n}return r(e,t),d(e,null,[{key:"cssClasses",get:function(){return s.a}},{key:"strings",get:function(){return s.c}},{key:"numbers",get:function(){return s.b}},{key:"defaultAdapter",get:function(){return{browserSupportsCssVars:function(){},isUnbounded:function(){},isSurfaceActive:function(){},isSurfaceDisabled:function(){},addClass:function(){},removeClass:function(){},containsEventTarget:function(){},registerInteractionHandler:function(){},deregisterInteractionHandler:function(){},registerDocumentInteractionHandler:function(){},deregisterDocumentInteractionHandler:function(){},registerResizeHandler:function(){},deregisterResizeHandler:function(){},updateCssVariable:function(){},computeBoundingRect:function(){},getWindowPageOffset:function(){}}}}]),d(e,[{key:"supportsPressRipple_",value:function(){return this.adapter_.browserSupportsCssVars()}},{key:"defaultActivationState_",value:function(){return{isActivated:!1,hasDeactivationUXRun:!1,wasActivatedByPointer:!1,wasElementMadeActive:!1,activationEvent:null,isProgrammatic:!1}}},{key:"init",value:function(){var t=this,n=this.supportsPressRipple_();if(this.registerRootHandlers_(n),n){var i=e.cssClasses,a=i.ROOT,r=i.UNBOUNDED;requestAnimationFrame(function(){t.adapter_.addClass(a),t.adapter_.isUnbounded()&&(t.adapter_.addClass(r),t.layoutInternal_())})}}},{key:"destroy",value:function(){var t=this;if(this.supportsPressRipple_()){if(this.activationTimer_){clearTimeout(this.activationTimer_),this.activationTimer_=0;var n=e.cssClasses.FG_ACTIVATION;this.adapter_.removeClass(n)}var i=e.cssClasses,a=i.ROOT,r=i.UNBOUNDED;requestAnimationFrame(function(){t.adapter_.removeClass(a),t.adapter_.removeClass(r),t.removeCssVars_()})}this.deregisterRootHandlers_(),this.deregisterDeactivationHandlers_()}},{key:"registerRootHandlers_",value:function(t){var e=this;t&&(l.forEach(function(t){e.adapter_.registerInteractionHandler(t,e.activateHandler_)}),this.adapter_.isUnbounded()&&this.adapter_.registerResizeHandler(this.resizeHandler_)),this.adapter_.registerInteractionHandler("focus",this.focusHandler_),this.adapter_.registerInteractionHandler("blur",this.blurHandler_)}},{key:"registerDeactivationHandlers_",value:function(t){var e=this;"keydown"===t.type?this.adapter_.registerInteractionHandler("keyup",this.deactivateHandler_):f.forEach(function(t){e.adapter_.registerDocumentInteractionHandler(t,e.deactivateHandler_)})}},{key:"deregisterRootHandlers_",value:function(){var t=this;l.forEach(function(e){t.adapter_.deregisterInteractionHandler(e,t.activateHandler_)}),this.adapter_.deregisterInteractionHandler("focus",this.focusHandler_),this.adapter_.deregisterInteractionHandler("blur",this.blurHandler_),this.adapter_.isUnbounded()&&this.adapter_.deregisterResizeHandler(this.resizeHandler_)}},{key:"deregisterDeactivationHandlers_",value:function(){var t=this;this.adapter_.deregisterInteractionHandler("keyup",this.deactivateHandler_),f.forEach(function(e){t.adapter_.deregisterDocumentInteractionHandler(e,t.deactivateHandler_)})}},{key:"removeCssVars_",value:function(){var t=this,n=e.strings;Object.keys(n).forEach(function(e){0===e.indexOf("VAR_")&&t.adapter_.updateCssVariable(n[e],null)})}},{key:"activate_",value:function(t){var e=this;if(!this.adapter_.isSurfaceDisabled()){var n=this.activationState_;if(!n.isActivated){var i=this.previousActivationEvent_;if(!(i&&t&&i.type!==t.type)){n.isActivated=!0,n.isProgrammatic=null===t,n.activationEvent=t,n.wasActivatedByPointer=!n.isProgrammatic&&("mousedown"===t.type||"touchstart"===t.type||"pointerdown"===t.type);if(t&&v.length>0&&v.some(function(t){return e.adapter_.containsEventTarget(t)}))return void this.resetActivationState_();t&&(v.push(t.target),this.registerDeactivationHandlers_(t)),n.wasElementMadeActive=this.checkElementMadeActive_(t),n.wasElementMadeActive&&this.animateActivation_(),requestAnimationFrame(function(){v=[],n.wasElementMadeActive||" "!==t.key&&32!==t.keyCode||(n.wasElementMadeActive=e.checkElementMadeActive_(t),n.wasElementMadeActive&&e.animateActivation_()),n.wasElementMadeActive||(e.activationState_=e.defaultActivationState_())})}}}}},{key:"checkElementMadeActive_",value:function(t){return!t||"keydown"!==t.type||this.adapter_.isSurfaceActive()}},{key:"activate",value:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:null;this.activate_(t)}},{key:"animateActivation_",value:function(){var t=this,n=e.strings,i=n.VAR_FG_TRANSLATE_START,a=n.VAR_FG_TRANSLATE_END,r=e.cssClasses,o=r.FG_DEACTIVATION,s=r.FG_ACTIVATION,u=e.numbers.DEACTIVATION_TIMEOUT_MS;this.layoutInternal_();var c="",d="";if(!this.adapter_.isUnbounded()){var l=this.getFgTranslationCoordinates_(),f=l.startPoint,v=l.endPoint;c=f.x+"px, "+f.y+"px",d=v.x+"px, "+v.y+"px"}this.adapter_.updateCssVariable(i,c),this.adapter_.updateCssVariable(a,d),clearTimeout(this.activationTimer_),clearTimeout(this.fgDeactivationRemovalTimer_),this.rmBoundedActivationClasses_(),this.adapter_.removeClass(o),this.adapter_.computeBoundingRect(),this.adapter_.addClass(s),this.activationTimer_=setTimeout(function(){return t.activationTimerCallback_()},u)}},{key:"getFgTranslationCoordinates_",value:function(){var t=this.activationState_,e=t.activationEvent,n=t.wasActivatedByPointer,i=void 0;return i=n?Object(u.getNormalizedEventCoords)(e,this.adapter_.getWindowPageOffset(),this.adapter_.computeBoundingRect()):{x:this.frame_.width/2,y:this.frame_.height/2},i={x:i.x-this.initialSize_/2,y:i.y-this.initialSize_/2},{startPoint:i,endPoint:{x:this.frame_.width/2-this.initialSize_/2,y:this.frame_.height/2-this.initialSize_/2}}}},{key:"runDeactivationUXLogicIfReady_",value:function(){var t=this,n=e.cssClasses.FG_DEACTIVATION,i=this.activationState_,a=i.hasDeactivationUXRun,r=i.isActivated;(a||!r)&&this.activationAnimationHasEnded_&&(this.rmBoundedActivationClasses_(),this.adapter_.addClass(n),this.fgDeactivationRemovalTimer_=setTimeout(function(){t.adapter_.removeClass(n)},s.b.FG_DEACTIVATION_MS))}},{key:"rmBoundedActivationClasses_",value:function(){var t=e.cssClasses.FG_ACTIVATION;this.adapter_.removeClass(t),this.activationAnimationHasEnded_=!1,this.adapter_.computeBoundingRect()}},{key:"resetActivationState_",value:function(){var t=this;this.previousActivationEvent_=this.activationState_.activationEvent,this.activationState_=this.defaultActivationState_(),setTimeout(function(){return t.previousActivationEvent_=null},e.numbers.TAP_DELAY_MS)}},{key:"deactivate_",value:function(t){var e=this,n=this.activationState_;if(n.isActivated){var i=c({},n);if(n.isProgrammatic){requestAnimationFrame(function(){return e.animateDeactivation_(null,i)}),this.resetActivationState_()}else this.deregisterDeactivationHandlers_(),requestAnimationFrame(function(){e.activationState_.hasDeactivationUXRun=!0,e.animateDeactivation_(t,i),e.resetActivationState_()})}}},{key:"deactivate",value:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:null;this.deactivate_(t)}},{key:"animateDeactivation_",value:function(t,e){var n=e.wasActivatedByPointer,i=e.wasElementMadeActive;(n||i)&&this.runDeactivationUXLogicIfReady_()}},{key:"layout",value:function(){var t=this;this.layoutFrame_&&cancelAnimationFrame(this.layoutFrame_),this.layoutFrame_=requestAnimationFrame(function(){t.layoutInternal_(),t.layoutFrame_=0})}},{key:"layoutInternal_",value:function(){var t=this;this.frame_=this.adapter_.computeBoundingRect();var n=Math.max(this.frame_.height,this.frame_.width);this.maxRadius_=this.adapter_.isUnbounded()?n:function(){return Math.sqrt(Math.pow(t.frame_.width,2)+Math.pow(t.frame_.height,2))+e.numbers.PADDING}(),this.initialSize_=n*e.numbers.INITIAL_ORIGIN_SCALE,this.fgScale_=this.maxRadius_/this.initialSize_,this.updateLayoutCssVars_()}},{key:"updateLayoutCssVars_",value:function(){var t=e.strings,n=t.VAR_FG_SIZE,i=t.VAR_LEFT,a=t.VAR_TOP,r=t.VAR_FG_SCALE;this.adapter_.updateCssVariable(n,this.initialSize_+"px"),this.adapter_.updateCssVariable(r,this.fgScale_),this.adapter_.isUnbounded()&&(this.unboundedCoords_={left:Math.round(this.frame_.width/2-this.initialSize_/2),top:Math.round(this.frame_.height/2-this.initialSize_/2)},this.adapter_.updateCssVariable(i,this.unboundedCoords_.left+"px"),this.adapter_.updateCssVariable(a,this.unboundedCoords_.top+"px"))}},{key:"setUnbounded",value:function(t){var n=e.cssClasses.UNBOUNDED;t?this.adapter_.addClass(n):this.adapter_.removeClass(n)}},{key:"handleFocus",value:function(){var t=this;requestAnimationFrame(function(){return t.adapter_.addClass(e.cssClasses.BG_FOCUSED)})}},{key:"handleBlur",value:function(){var t=this;requestAnimationFrame(function(){return t.adapter_.removeClass(e.cssClasses.BG_FOCUSED)})}}]),e}(o.a);e.a=p},function(t,e,n){"use strict";n.d(e,"a",function(){return i}),n.d(e,"c",function(){return a}),n.d(e,"b",function(){return r});/**
+ * @license
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+var i={ROOT:"mdc-ripple-upgraded",UNBOUNDED:"mdc-ripple-upgraded--unbounded",BG_FOCUSED:"mdc-ripple-upgraded--background-focused",FG_ACTIVATION:"mdc-ripple-upgraded--foreground-activation",FG_DEACTIVATION:"mdc-ripple-upgraded--foreground-deactivation"},a={VAR_LEFT:"--mdc-ripple-left",VAR_TOP:"--mdc-ripple-top",VAR_FG_SIZE:"--mdc-ripple-fg-size",VAR_FG_SCALE:"--mdc-ripple-fg-scale",VAR_FG_TRANSLATE_START:"--mdc-ripple-fg-translate-start",VAR_FG_TRANSLATE_END:"--mdc-ripple-fg-translate-end"},r={PADDING:10,INITIAL_ORIGIN_SCALE:.6,DEACTIVATION_TIMEOUT_MS:225,FG_DEACTIVATION_MS:150,TAP_DELAY_MS:300}}])});
+//# sourceMappingURL=mdc.ripple.min.js.map
\ No newline at end of file
diff --git a/node_modules/@material/textfield/node_modules/@material/ripple/foundation.js b/node_modules/@material/textfield/node_modules/@material/ripple/foundation.js
new file mode 100644
index 0000000..16dcc8f
--- /dev/null
+++ b/node_modules/@material/textfield/node_modules/@material/ripple/foundation.js
@@ -0,0 +1,604 @@
+/**
+ * @license
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import MDCFoundation from '@material/base/foundation';
+import MDCRippleAdapter from './adapter';
+import {cssClasses, strings, numbers} from './constants';
+import {getNormalizedEventCoords} from './util';
+
+/**
+ * @typedef {{
+ *   isActivated: (boolean|undefined),
+ *   hasDeactivationUXRun: (boolean|undefined),
+ *   wasActivatedByPointer: (boolean|undefined),
+ *   wasElementMadeActive: (boolean|undefined),
+ *   activationEvent: Event,
+ *   isProgrammatic: (boolean|undefined)
+ * }}
+ */
+let ActivationStateType;
+
+/**
+ * @typedef {{
+ *   activate: (string|undefined),
+ *   deactivate: (string|undefined),
+ *   focus: (string|undefined),
+ *   blur: (string|undefined)
+ * }}
+ */
+let ListenerInfoType;
+
+/**
+ * @typedef {{
+ *   activate: function(!Event),
+ *   deactivate: function(!Event),
+ *   focus: function(),
+ *   blur: function()
+ * }}
+ */
+let ListenersType;
+
+/**
+ * @typedef {{
+ *   x: number,
+ *   y: number
+ * }}
+ */
+let PointType;
+
+// Activation events registered on the root element of each instance for activation
+const ACTIVATION_EVENT_TYPES = ['touchstart', 'pointerdown', 'mousedown', 'keydown'];
+
+// Deactivation events registered on documentElement when a pointer-related down event occurs
+const POINTER_DEACTIVATION_EVENT_TYPES = ['touchend', 'pointerup', 'mouseup'];
+
+// Tracks activations that have occurred on the current frame, to avoid simultaneous nested activations
+/** @type {!Array<!EventTarget>} */
+let activatedTargets = [];
+
+/**
+ * @extends {MDCFoundation<!MDCRippleAdapter>}
+ */
+class MDCRippleFoundation extends MDCFoundation {
+  static get cssClasses() {
+    return cssClasses;
+  }
+
+  static get strings() {
+    return strings;
+  }
+
+  static get numbers() {
+    return numbers;
+  }
+
+  static get defaultAdapter() {
+    return {
+      browserSupportsCssVars: () => /* boolean - cached */ {},
+      isUnbounded: () => /* boolean */ {},
+      isSurfaceActive: () => /* boolean */ {},
+      isSurfaceDisabled: () => /* boolean */ {},
+      addClass: (/* className: string */) => {},
+      removeClass: (/* className: string */) => {},
+      containsEventTarget: (/* target: !EventTarget */) => {},
+      registerInteractionHandler: (/* evtType: string, handler: EventListener */) => {},
+      deregisterInteractionHandler: (/* evtType: string, handler: EventListener */) => {},
+      registerDocumentInteractionHandler: (/* evtType: string, handler: EventListener */) => {},
+      deregisterDocumentInteractionHandler: (/* evtType: string, handler: EventListener */) => {},
+      registerResizeHandler: (/* handler: EventListener */) => {},
+      deregisterResizeHandler: (/* handler: EventListener */) => {},
+      updateCssVariable: (/* varName: string, value: string */) => {},
+      computeBoundingRect: () => /* ClientRect */ {},
+      getWindowPageOffset: () => /* {x: number, y: number} */ {},
+    };
+  }
+
+  constructor(adapter) {
+    super(Object.assign(MDCRippleFoundation.defaultAdapter, adapter));
+
+    /** @private {number} */
+    this.layoutFrame_ = 0;
+
+    /** @private {!ClientRect} */
+    this.frame_ = /** @type {!ClientRect} */ ({width: 0, height: 0});
+
+    /** @private {!ActivationStateType} */
+    this.activationState_ = this.defaultActivationState_();
+
+    /** @private {number} */
+    this.initialSize_ = 0;
+
+    /** @private {number} */
+    this.maxRadius_ = 0;
+
+    /** @private {function(!Event)} */
+    this.activateHandler_ = (e) => this.activate_(e);
+
+    /** @private {function(!Event)} */
+    this.deactivateHandler_ = (e) => this.deactivate_(e);
+
+    /** @private {function(?Event=)} */
+    this.focusHandler_ = () => this.handleFocus();
+
+    /** @private {function(?Event=)} */
+    this.blurHandler_ = () => this.handleBlur();
+
+    /** @private {!Function} */
+    this.resizeHandler_ = () => this.layout();
+
+    /** @private {{left: number, top:number}} */
+    this.unboundedCoords_ = {
+      left: 0,
+      top: 0,
+    };
+
+    /** @private {number} */
+    this.fgScale_ = 0;
+
+    /** @private {number} */
+    this.activationTimer_ = 0;
+
+    /** @private {number} */
+    this.fgDeactivationRemovalTimer_ = 0;
+
+    /** @private {boolean} */
+    this.activationAnimationHasEnded_ = false;
+
+    /** @private {!Function} */
+    this.activationTimerCallback_ = () => {
+      this.activationAnimationHasEnded_ = true;
+      this.runDeactivationUXLogicIfReady_();
+    };
+
+    /** @private {?Event} */
+    this.previousActivationEvent_ = null;
+  }
+
+  /**
+   * We compute this property so that we are not querying information about the client
+   * until the point in time where the foundation requests it. This prevents scenarios where
+   * client-side feature-detection may happen too early, such as when components are rendered on the server
+   * and then initialized at mount time on the client.
+   * @return {boolean}
+   * @private
+   */
+  supportsPressRipple_() {
+    return this.adapter_.browserSupportsCssVars();
+  }
+
+  /**
+   * @return {!ActivationStateType}
+   */
+  defaultActivationState_() {
+    return {
+      isActivated: false,
+      hasDeactivationUXRun: false,
+      wasActivatedByPointer: false,
+      wasElementMadeActive: false,
+      activationEvent: null,
+      isProgrammatic: false,
+    };
+  }
+
+  /** @override */
+  init() {
+    const supportsPressRipple = this.supportsPressRipple_();
+
+    this.registerRootHandlers_(supportsPressRipple);
+
+    if (supportsPressRipple) {
+      const {ROOT, UNBOUNDED} = MDCRippleFoundation.cssClasses;
+      requestAnimationFrame(() => {
+        this.adapter_.addClass(ROOT);
+        if (this.adapter_.isUnbounded()) {
+          this.adapter_.addClass(UNBOUNDED);
+          // Unbounded ripples need layout logic applied immediately to set coordinates for both shade and ripple
+          this.layoutInternal_();
+        }
+      });
+    }
+  }
+
+  /** @override */
+  destroy() {
+    if (this.supportsPressRipple_()) {
+      if (this.activationTimer_) {
+        clearTimeout(this.activationTimer_);
+        this.activationTimer_ = 0;
+        const {FG_ACTIVATION} = MDCRippleFoundation.cssClasses;
+        this.adapter_.removeClass(FG_ACTIVATION);
+      }
+
+      const {ROOT, UNBOUNDED} = MDCRippleFoundation.cssClasses;
+      requestAnimationFrame(() => {
+        this.adapter_.removeClass(ROOT);
+        this.adapter_.removeClass(UNBOUNDED);
+        this.removeCssVars_();
+      });
+    }
+
+    this.deregisterRootHandlers_();
+    this.deregisterDeactivationHandlers_();
+  }
+
+  /**
+   * @param {boolean} supportsPressRipple Passed from init to save a redundant function call
+   * @private
+   */
+  registerRootHandlers_(supportsPressRipple) {
+    if (supportsPressRipple) {
+      ACTIVATION_EVENT_TYPES.forEach((type) => {
+        this.adapter_.registerInteractionHandler(type, this.activateHandler_);
+      });
+      if (this.adapter_.isUnbounded()) {
+        this.adapter_.registerResizeHandler(this.resizeHandler_);
+      }
+    }
+
+    this.adapter_.registerInteractionHandler('focus', this.focusHandler_);
+    this.adapter_.registerInteractionHandler('blur', this.blurHandler_);
+  }
+
+  /**
+   * @param {!Event} e
+   * @private
+   */
+  registerDeactivationHandlers_(e) {
+    if (e.type === 'keydown') {
+      this.adapter_.registerInteractionHandler('keyup', this.deactivateHandler_);
+    } else {
+      POINTER_DEACTIVATION_EVENT_TYPES.forEach((type) => {
+        this.adapter_.registerDocumentInteractionHandler(type, this.deactivateHandler_);
+      });
+    }
+  }
+
+  /** @private */
+  deregisterRootHandlers_() {
+    ACTIVATION_EVENT_TYPES.forEach((type) => {
+      this.adapter_.deregisterInteractionHandler(type, this.activateHandler_);
+    });
+    this.adapter_.deregisterInteractionHandler('focus', this.focusHandler_);
+    this.adapter_.deregisterInteractionHandler('blur', this.blurHandler_);
+
+    if (this.adapter_.isUnbounded()) {
+      this.adapter_.deregisterResizeHandler(this.resizeHandler_);
+    }
+  }
+
+  /** @private */
+  deregisterDeactivationHandlers_() {
+    this.adapter_.deregisterInteractionHandler('keyup', this.deactivateHandler_);
+    POINTER_DEACTIVATION_EVENT_TYPES.forEach((type) => {
+      this.adapter_.deregisterDocumentInteractionHandler(type, this.deactivateHandler_);
+    });
+  }
+
+  /** @private */
+  removeCssVars_() {
+    const {strings} = MDCRippleFoundation;
+    Object.keys(strings).forEach((k) => {
+      if (k.indexOf('VAR_') === 0) {
+        this.adapter_.updateCssVariable(strings[k], null);
+      }
+    });
+  }
+
+  /**
+   * @param {?Event} e
+   * @private
+   */
+  activate_(e) {
+    if (this.adapter_.isSurfaceDisabled()) {
+      return;
+    }
+
+    const activationState = this.activationState_;
+    if (activationState.isActivated) {
+      return;
+    }
+
+    // Avoid reacting to follow-on events fired by touch device after an already-processed user interaction
+    const previousActivationEvent = this.previousActivationEvent_;
+    const isSameInteraction = previousActivationEvent && e && previousActivationEvent.type !== e.type;
+    if (isSameInteraction) {
+      return;
+    }
+
+    activationState.isActivated = true;
+    activationState.isProgrammatic = e === null;
+    activationState.activationEvent = e;
+    activationState.wasActivatedByPointer = activationState.isProgrammatic ? false : (
+      e.type === 'mousedown' || e.type === 'touchstart' || e.type === 'pointerdown'
+    );
+
+    const hasActivatedChild =
+      e && activatedTargets.length > 0 && activatedTargets.some((target) => this.adapter_.containsEventTarget(target));
+    if (hasActivatedChild) {
+      // Immediately reset activation state, while preserving logic that prevents touch follow-on events
+      this.resetActivationState_();
+      return;
+    }
+
+    if (e) {
+      activatedTargets.push(/** @type {!EventTarget} */ (e.target));
+      this.registerDeactivationHandlers_(e);
+    }
+
+    activationState.wasElementMadeActive = this.checkElementMadeActive_(e);
+    if (activationState.wasElementMadeActive) {
+      this.animateActivation_();
+    }
+
+    requestAnimationFrame(() => {
+      // Reset array on next frame after the current event has had a chance to bubble to prevent ancestor ripples
+      activatedTargets = [];
+
+      if (!activationState.wasElementMadeActive && (e.key === ' ' || e.keyCode === 32)) {
+        // If space was pressed, try again within an rAF call to detect :active, because different UAs report
+        // active states inconsistently when they're called within event handling code:
+        // - https://bugs.chromium.org/p/chromium/issues/detail?id=635971
+        // - https://bugzilla.mozilla.org/show_bug.cgi?id=1293741
+        // We try first outside rAF to support Edge, which does not exhibit this problem, but will crash if a CSS
+        // variable is set within a rAF callback for a submit button interaction (#2241).
+        activationState.wasElementMadeActive = this.checkElementMadeActive_(e);
+        if (activationState.wasElementMadeActive) {
+          this.animateActivation_();
+        }
+      }
+
+      if (!activationState.wasElementMadeActive) {
+        // Reset activation state immediately if element was not made active.
+        this.activationState_ = this.defaultActivationState_();
+      }
+    });
+  }
+
+  /**
+   * @param {?Event} e
+   * @private
+   */
+  checkElementMadeActive_(e) {
+    return (e && e.type === 'keydown') ? this.adapter_.isSurfaceActive() : true;
+  }
+
+  /**
+   * @param {?Event=} event Optional event containing position information.
+   */
+  activate(event = null) {
+    this.activate_(event);
+  }
+
+  /** @private */
+  animateActivation_() {
+    const {VAR_FG_TRANSLATE_START, VAR_FG_TRANSLATE_END} = MDCRippleFoundation.strings;
+    const {FG_DEACTIVATION, FG_ACTIVATION} = MDCRippleFoundation.cssClasses;
+    const {DEACTIVATION_TIMEOUT_MS} = MDCRippleFoundation.numbers;
+
+    this.layoutInternal_();
+
+    let translateStart = '';
+    let translateEnd = '';
+
+    if (!this.adapter_.isUnbounded()) {
+      const {startPoint, endPoint} = this.getFgTranslationCoordinates_();
+      translateStart = `${startPoint.x}px, ${startPoint.y}px`;
+      translateEnd = `${endPoint.x}px, ${endPoint.y}px`;
+    }
+
+    this.adapter_.updateCssVariable(VAR_FG_TRANSLATE_START, translateStart);
+    this.adapter_.updateCssVariable(VAR_FG_TRANSLATE_END, translateEnd);
+    // Cancel any ongoing activation/deactivation animations
+    clearTimeout(this.activationTimer_);
+    clearTimeout(this.fgDeactivationRemovalTimer_);
+    this.rmBoundedActivationClasses_();
+    this.adapter_.removeClass(FG_DEACTIVATION);
+
+    // Force layout in order to re-trigger the animation.
+    this.adapter_.computeBoundingRect();
+    this.adapter_.addClass(FG_ACTIVATION);
+    this.activationTimer_ = setTimeout(() => this.activationTimerCallback_(), DEACTIVATION_TIMEOUT_MS);
+  }
+
+  /**
+   * @private
+   * @return {{startPoint: PointType, endPoint: PointType}}
+   */
+  getFgTranslationCoordinates_() {
+    const {activationEvent, wasActivatedByPointer} = this.activationState_;
+
+    let startPoint;
+    if (wasActivatedByPointer) {
+      startPoint = getNormalizedEventCoords(
+        /** @type {!Event} */ (activationEvent),
+        this.adapter_.getWindowPageOffset(), this.adapter_.computeBoundingRect()
+      );
+    } else {
+      startPoint = {
+        x: this.frame_.width / 2,
+        y: this.frame_.height / 2,
+      };
+    }
+    // Center the element around the start point.
+    startPoint = {
+      x: startPoint.x - (this.initialSize_ / 2),
+      y: startPoint.y - (this.initialSize_ / 2),
+    };
+
+    const endPoint = {
+      x: (this.frame_.width / 2) - (this.initialSize_ / 2),
+      y: (this.frame_.height / 2) - (this.initialSize_ / 2),
+    };
+
+    return {startPoint, endPoint};
+  }
+
+  /** @private */
+  runDeactivationUXLogicIfReady_() {
+    // This method is called both when a pointing device is released, and when the activation animation ends.
+    // The deactivation animation should only run after both of those occur.
+    const {FG_DEACTIVATION} = MDCRippleFoundation.cssClasses;
+    const {hasDeactivationUXRun, isActivated} = this.activationState_;
+    const activationHasEnded = hasDeactivationUXRun || !isActivated;
+
+    if (activationHasEnded && this.activationAnimationHasEnded_) {
+      this.rmBoundedActivationClasses_();
+      this.adapter_.addClass(FG_DEACTIVATION);
+      this.fgDeactivationRemovalTimer_ = setTimeout(() => {
+        this.adapter_.removeClass(FG_DEACTIVATION);
+      }, numbers.FG_DEACTIVATION_MS);
+    }
+  }
+
+  /** @private */
+  rmBoundedActivationClasses_() {
+    const {FG_ACTIVATION} = MDCRippleFoundation.cssClasses;
+    this.adapter_.removeClass(FG_ACTIVATION);
+    this.activationAnimationHasEnded_ = false;
+    this.adapter_.computeBoundingRect();
+  }
+
+  resetActivationState_() {
+    this.previousActivationEvent_ = this.activationState_.activationEvent;
+    this.activationState_ = this.defaultActivationState_();
+    // Touch devices may fire additional events for the same interaction within a short time.
+    // Store the previous event until it's safe to assume that subsequent events are for new interactions.
+    setTimeout(() => this.previousActivationEvent_ = null, MDCRippleFoundation.numbers.TAP_DELAY_MS);
+  }
+
+  /**
+   * @param {?Event} e
+   * @private
+   */
+  deactivate_(e) {
+    const activationState = this.activationState_;
+    // This can happen in scenarios such as when you have a keyup event that blurs the element.
+    if (!activationState.isActivated) {
+      return;
+    }
+
+    const state = /** @type {!ActivationStateType} */ (Object.assign({}, activationState));
+
+    if (activationState.isProgrammatic) {
+      const evtObject = null;
+      requestAnimationFrame(() => this.animateDeactivation_(evtObject, state));
+      this.resetActivationState_();
+    } else {
+      this.deregisterDeactivationHandlers_();
+      requestAnimationFrame(() => {
+        this.activationState_.hasDeactivationUXRun = true;
+        this.animateDeactivation_(e, state);
+        this.resetActivationState_();
+      });
+    }
+  }
+
+  /**
+   * @param {?Event=} event Optional event containing position information.
+   */
+  deactivate(event = null) {
+    this.deactivate_(event);
+  }
+
+  /**
+   * @param {Event} e
+   * @param {!ActivationStateType} options
+   * @private
+   */
+  animateDeactivation_(e, {wasActivatedByPointer, wasElementMadeActive}) {
+    if (wasActivatedByPointer || wasElementMadeActive) {
+      this.runDeactivationUXLogicIfReady_();
+    }
+  }
+
+  layout() {
+    if (this.layoutFrame_) {
+      cancelAnimationFrame(this.layoutFrame_);
+    }
+    this.layoutFrame_ = requestAnimationFrame(() => {
+      this.layoutInternal_();
+      this.layoutFrame_ = 0;
+    });
+  }
+
+  /** @private */
+  layoutInternal_() {
+    this.frame_ = this.adapter_.computeBoundingRect();
+    const maxDim = Math.max(this.frame_.height, this.frame_.width);
+
+    // Surface diameter is treated differently for unbounded vs. bounded ripples.
+    // Unbounded ripple diameter is calculated smaller since the surface is expected to already be padded appropriately
+    // to extend the hitbox, and the ripple is expected to meet the edges of the padded hitbox (which is typically
+    // square). Bounded ripples, on the other hand, are fully expected to expand beyond the surface's longest diameter
+    // (calculated based on the diagonal plus a constant padding), and are clipped at the surface's border via
+    // `overflow: hidden`.
+    const getBoundedRadius = () => {
+      const hypotenuse = Math.sqrt(Math.pow(this.frame_.width, 2) + Math.pow(this.frame_.height, 2));
+      return hypotenuse + MDCRippleFoundation.numbers.PADDING;
+    };
+
+    this.maxRadius_ = this.adapter_.isUnbounded() ? maxDim : getBoundedRadius();
+
+    // Ripple is sized as a fraction of the largest dimension of the surface, then scales up using a CSS scale transform
+    this.initialSize_ = maxDim * MDCRippleFoundation.numbers.INITIAL_ORIGIN_SCALE;
+    this.fgScale_ = this.maxRadius_ / this.initialSize_;
+
+    this.updateLayoutCssVars_();
+  }
+
+  /** @private */
+  updateLayoutCssVars_() {
+    const {
+      VAR_FG_SIZE, VAR_LEFT, VAR_TOP, VAR_FG_SCALE,
+    } = MDCRippleFoundation.strings;
+
+    this.adapter_.updateCssVariable(VAR_FG_SIZE, `${this.initialSize_}px`);
+    this.adapter_.updateCssVariable(VAR_FG_SCALE, this.fgScale_);
+
+    if (this.adapter_.isUnbounded()) {
+      this.unboundedCoords_ = {
+        left: Math.round((this.frame_.width / 2) - (this.initialSize_ / 2)),
+        top: Math.round((this.frame_.height / 2) - (this.initialSize_ / 2)),
+      };
+
+      this.adapter_.updateCssVariable(VAR_LEFT, `${this.unboundedCoords_.left}px`);
+      this.adapter_.updateCssVariable(VAR_TOP, `${this.unboundedCoords_.top}px`);
+    }
+  }
+
+  /** @param {boolean} unbounded */
+  setUnbounded(unbounded) {
+    const {UNBOUNDED} = MDCRippleFoundation.cssClasses;
+    if (unbounded) {
+      this.adapter_.addClass(UNBOUNDED);
+    } else {
+      this.adapter_.removeClass(UNBOUNDED);
+    }
+  }
+
+  handleFocus() {
+    requestAnimationFrame(() =>
+      this.adapter_.addClass(MDCRippleFoundation.cssClasses.BG_FOCUSED));
+  }
+
+  handleBlur() {
+    requestAnimationFrame(() =>
+      this.adapter_.removeClass(MDCRippleFoundation.cssClasses.BG_FOCUSED));
+  }
+}
+
+export default MDCRippleFoundation;
diff --git a/node_modules/@material/textfield/node_modules/@material/ripple/index.js b/node_modules/@material/textfield/node_modules/@material/ripple/index.js
new file mode 100644
index 0000000..d2233d8
--- /dev/null
+++ b/node_modules/@material/textfield/node_modules/@material/ripple/index.js
@@ -0,0 +1,153 @@
+/**
+ * @license
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import MDCComponent from '@material/base/component';
+import MDCRippleAdapter from './adapter';
+import MDCRippleFoundation from './foundation';
+import * as util from './util';
+
+/**
+ * @extends MDCComponent<!MDCRippleFoundation>
+ */
+class MDCRipple extends MDCComponent {
+  /** @param {...?} args */
+  constructor(...args) {
+    super(...args);
+
+    /** @type {boolean} */
+    this.disabled = false;
+
+    /** @private {boolean} */
+    this.unbounded_;
+  }
+
+  /**
+   * @param {!Element} root
+   * @param {{isUnbounded: (boolean|undefined)}=} options
+   * @return {!MDCRipple}
+   */
+  static attachTo(root, {isUnbounded = undefined} = {}) {
+    const ripple = new MDCRipple(root);
+    // Only override unbounded behavior if option is explicitly specified
+    if (isUnbounded !== undefined) {
+      ripple.unbounded = /** @type {boolean} */ (isUnbounded);
+    }
+    return ripple;
+  }
+
+  /**
+   * @param {!RippleCapableSurface} instance
+   * @return {!MDCRippleAdapter}
+   */
+  static createAdapter(instance) {
+    const MATCHES = util.getMatchesProperty(HTMLElement.prototype);
+
+    return {
+      browserSupportsCssVars: () => util.supportsCssVariables(window),
+      isUnbounded: () => instance.unbounded,
+      isSurfaceActive: () => instance.root_[MATCHES](':active'),
+      isSurfaceDisabled: () => instance.disabled,
+      addClass: (className) => instance.root_.classList.add(className),
+      removeClass: (className) => instance.root_.classList.remove(className),
+      containsEventTarget: (target) => instance.root_.contains(target),
+      registerInteractionHandler: (evtType, handler) =>
+        instance.root_.addEventListener(evtType, handler, util.applyPassive()),
+      deregisterInteractionHandler: (evtType, handler) =>
+        instance.root_.removeEventListener(evtType, handler, util.applyPassive()),
+      registerDocumentInteractionHandler: (evtType, handler) =>
+        document.documentElement.addEventListener(evtType, handler, util.applyPassive()),
+      deregisterDocumentInteractionHandler: (evtType, handler) =>
+        document.documentElement.removeEventListener(evtType, handler, util.applyPassive()),
+      registerResizeHandler: (handler) => window.addEventListener('resize', handler),
+      deregisterResizeHandler: (handler) => window.removeEventListener('resize', handler),
+      updateCssVariable: (varName, value) => instance.root_.style.setProperty(varName, value),
+      computeBoundingRect: () => instance.root_.getBoundingClientRect(),
+      getWindowPageOffset: () => ({x: window.pageXOffset, y: window.pageYOffset}),
+    };
+  }
+
+  /** @return {boolean} */
+  get unbounded() {
+    return this.unbounded_;
+  }
+
+  /** @param {boolean} unbounded */
+  set unbounded(unbounded) {
+    this.unbounded_ = Boolean(unbounded);
+    this.setUnbounded_();
+  }
+
+  /**
+   * Closure Compiler throws an access control error when directly accessing a
+   * protected or private property inside a getter/setter, like unbounded above.
+   * By accessing the protected property inside a method, we solve that problem.
+   * That's why this function exists.
+   * @private
+   */
+  setUnbounded_() {
+    this.foundation_.setUnbounded(this.unbounded_);
+  }
+
+  activate() {
+    this.foundation_.activate();
+  }
+
+  deactivate() {
+    this.foundation_.deactivate();
+  }
+
+  layout() {
+    this.foundation_.layout();
+  }
+
+  /**
+   * @return {!MDCRippleFoundation}
+   * @override
+   */
+  getDefaultFoundation() {
+    return new MDCRippleFoundation(MDCRipple.createAdapter(this));
+  }
+
+  /** @override */
+  initialSyncWithDOM() {
+    this.unbounded = 'mdcRippleIsUnbounded' in this.root_.dataset;
+  }
+}
+
+/**
+ * See Material Design spec for more details on when to use ripples.
+ * https://material.io/guidelines/motion/choreography.html#choreography-creation
+ * @record
+ */
+class RippleCapableSurface {}
+
+/** @protected {!Element} */
+RippleCapableSurface.prototype.root_;
+
+/**
+ * Whether or not the ripple bleeds out of the bounds of the element.
+ * @type {boolean|undefined}
+ */
+RippleCapableSurface.prototype.unbounded;
+
+/**
+ * Whether or not the ripple is attached to a disabled component.
+ * @type {boolean|undefined}
+ */
+RippleCapableSurface.prototype.disabled;
+
+export {MDCRipple, MDCRippleFoundation, RippleCapableSurface, util};
diff --git a/node_modules/@material/textfield/node_modules/@material/ripple/mdc-ripple.scss b/node_modules/@material/textfield/node_modules/@material/ripple/mdc-ripple.scss
new file mode 100644
index 0000000..a384872
--- /dev/null
+++ b/node_modules/@material/textfield/node_modules/@material/ripple/mdc-ripple.scss
@@ -0,0 +1,49 @@
+//
+// Copyright 2016 Google Inc. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+@import "@material/animation/functions";
+@import "@material/theme/mixins";
+@import "./common";
+@import "./mixins";
+@import "./variables";
+
+// postcss-bem-linter: define ripple-surface
+
+.mdc-ripple-surface {
+  @include mdc-ripple-surface;
+  @include mdc-states;
+  @include mdc-ripple-radius-bounded;
+
+  position: relative;
+  outline: none;
+  overflow: hidden;
+
+  &[data-mdc-ripple-is-unbounded] {
+    @include mdc-ripple-radius-unbounded;
+
+    overflow: visible;
+  }
+
+  &--primary {
+    @include mdc-states(primary);
+  }
+
+  &--accent {
+    @include mdc-states(secondary);
+  }
+}
+
+// postcss-bem-linter: end
diff --git a/node_modules/@material/textfield/node_modules/@material/ripple/package.json b/node_modules/@material/textfield/node_modules/@material/ripple/package.json
new file mode 100644
index 0000000..5c0a081
--- /dev/null
+++ b/node_modules/@material/textfield/node_modules/@material/ripple/package.json
@@ -0,0 +1,51 @@
+{
+  "_from": "@material/ripple@^0.38.1",
+  "_id": "@material/ripple@0.38.1",
+  "_inBundle": false,
+  "_integrity": "sha512-Y7fmJCEJMfJFkyDCEHkBR66tHqy4JAlG49rk0cI0/xdAFmAKyqUcpJiVwhF+pC8Fad90Wi3G93xu/ig7dvz1bA==",
+  "_location": "/@material/textfield/@material/ripple",
+  "_phantomChildren": {},
+  "_requested": {
+    "type": "range",
+    "registry": true,
+    "raw": "@material/ripple@^0.38.1",
+    "name": "@material/ripple",
+    "escapedName": "@material%2fripple",
+    "scope": "@material",
+    "rawSpec": "^0.38.1",
+    "saveSpec": null,
+    "fetchSpec": "^0.38.1"
+  },
+  "_requiredBy": [
+    "/@material/textfield"
+  ],
+  "_resolved": "https://registry.npmjs.org/@material/ripple/-/ripple-0.38.1.tgz",
+  "_shasum": "74e61ed28e7680e0fd990fa50fa1949da456b3cb",
+  "_spec": "@material/ripple@^0.38.1",
+  "_where": "C:\\Users\\jakch\\github\\tool-hub\\node_modules\\@material\\textfield",
+  "bugs": {
+    "url": "https://github.com/material-components/material-components-web/issues"
+  },
+  "bundleDependencies": false,
+  "dependencies": {
+    "@material/animation": "^0.34.0",
+    "@material/base": "^0.35.0",
+    "@material/theme": "^0.38.0"
+  },
+  "deprecated": false,
+  "description": "The Material Components for the web Ink Ripple effect for web element interactions",
+  "homepage": "https://github.com/material-components/material-components-web#readme",
+  "keywords": [
+    "material components",
+    "material design",
+    "ripple"
+  ],
+  "license": "Apache-2.0",
+  "main": "index.js",
+  "name": "@material/ripple",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/material-components/material-components-web.git"
+  },
+  "version": "0.38.1"
+}
diff --git a/node_modules/@material/textfield/node_modules/@material/ripple/util.js b/node_modules/@material/textfield/node_modules/@material/ripple/util.js
new file mode 100644
index 0000000..b0941d4
--- /dev/null
+++ b/node_modules/@material/textfield/node_modules/@material/ripple/util.js
@@ -0,0 +1,146 @@
+/**
+ * @license
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * Stores result from supportsCssVariables to avoid redundant processing to detect CSS custom variable support.
+ * @private {boolean|undefined}
+ */
+let supportsCssVariables_;
+
+/**
+ * Stores result from applyPassive to avoid redundant processing to detect passive event listener support.
+ * @private {boolean|undefined}
+ */
+let supportsPassive_;
+
+/**
+ * @param {!Window} windowObj
+ * @return {boolean}
+ */
+function detectEdgePseudoVarBug(windowObj) {
+  // Detect versions of Edge with buggy var() support
+  // See: https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/11495448/
+  const document = windowObj.document;
+  const node = document.createElement('div');
+  node.className = 'mdc-ripple-surface--test-edge-var-bug';
+  document.body.appendChild(node);
+
+  // The bug exists if ::before style ends up propagating to the parent element.
+  // Additionally, getComputedStyle returns null in iframes with display: "none" in Firefox,
+  // but Firefox is known to support CSS custom properties correctly.
+  // See: https://bugzilla.mozilla.org/show_bug.cgi?id=548397
+  const computedStyle = windowObj.getComputedStyle(node);
+  const hasPseudoVarBug = computedStyle !== null && computedStyle.borderTopStyle === 'solid';
+  node.remove();
+  return hasPseudoVarBug;
+}
+
+/**
+ * @param {!Window} windowObj
+ * @param {boolean=} forceRefresh
+ * @return {boolean|undefined}
+ */
+
+function supportsCssVariables(windowObj, forceRefresh = false) {
+  let supportsCssVariables = supportsCssVariables_;
+  if (typeof supportsCssVariables_ === 'boolean' && !forceRefresh) {
+    return supportsCssVariables;
+  }
+
+  const supportsFunctionPresent = windowObj.CSS && typeof windowObj.CSS.supports === 'function';
+  if (!supportsFunctionPresent) {
+    return;
+  }
+
+  const explicitlySupportsCssVars = windowObj.CSS.supports('--css-vars', 'yes');
+  // See: https://bugs.webkit.org/show_bug.cgi?id=154669
+  // See: README section on Safari
+  const weAreFeatureDetectingSafari10plus = (
+    windowObj.CSS.supports('(--css-vars: yes)') &&
+    windowObj.CSS.supports('color', '#00000000')
+  );
+
+  if (explicitlySupportsCssVars || weAreFeatureDetectingSafari10plus) {
+    supportsCssVariables = !detectEdgePseudoVarBug(windowObj);
+  } else {
+    supportsCssVariables = false;
+  }
+
+  if (!forceRefresh) {
+    supportsCssVariables_ = supportsCssVariables;
+  }
+  return supportsCssVariables;
+}
+
+//
+/**
+ * Determine whether the current browser supports passive event listeners, and if so, use them.
+ * @param {!Window=} globalObj
+ * @param {boolean=} forceRefresh
+ * @return {boolean|{passive: boolean}}
+ */
+function applyPassive(globalObj = window, forceRefresh = false) {
+  if (supportsPassive_ === undefined || forceRefresh) {
+    let isSupported = false;
+    try {
+      globalObj.document.addEventListener('test', null, {get passive() {
+        isSupported = true;
+      }});
+    } catch (e) { }
+
+    supportsPassive_ = isSupported;
+  }
+
+  return supportsPassive_ ? {passive: true} : false;
+}
+
+/**
+ * @param {!Object} HTMLElementPrototype
+ * @return {!Array<string>}
+ */
+function getMatchesProperty(HTMLElementPrototype) {
+  return [
+    'webkitMatchesSelector', 'msMatchesSelector', 'matches',
+  ].filter((p) => p in HTMLElementPrototype).pop();
+}
+
+/**
+ * @param {!Event} ev
+ * @param {{x: number, y: number}} pageOffset
+ * @param {!ClientRect} clientRect
+ * @return {{x: number, y: number}}
+ */
+function getNormalizedEventCoords(ev, pageOffset, clientRect) {
+  const {x, y} = pageOffset;
+  const documentX = x + clientRect.left;
+  const documentY = y + clientRect.top;
+
+  let normalizedX;
+  let normalizedY;
+  // Determine touch point relative to the ripple container.
+  if (ev.type === 'touchstart') {
+    normalizedX = ev.changedTouches[0].pageX - documentX;
+    normalizedY = ev.changedTouches[0].pageY - documentY;
+  } else {
+    normalizedX = ev.pageX - documentX;
+    normalizedY = ev.pageY - documentY;
+  }
+
+  return {x: normalizedX, y: normalizedY};
+}
+
+export {supportsCssVariables, applyPassive, getMatchesProperty, getNormalizedEventCoords};
diff --git a/node_modules/@material/textfield/node_modules/@material/theme/README.md b/node_modules/@material/textfield/node_modules/@material/theme/README.md
new file mode 100644
index 0000000..f757529
--- /dev/null
+++ b/node_modules/@material/textfield/node_modules/@material/theme/README.md
@@ -0,0 +1,181 @@
+<!--docs:
+title: "Theme"
+layout: detail
+section: components
+excerpt: "Color theming for MDC Web components."
+iconId: theme
+path: /catalog/theme/
+-->
+
+# Theme
+
+The Material Design color system can be used to create a color scheme that reflects your brand or style.
+
+## Design & API Documentation
+
+<ul class="icon-list">
+  <li class="icon-list-item icon-list-item--spec">
+    <a href="https://material.io/go/design-theming">Material Design guidelines: Color</a>
+  </li>
+</ul>
+
+## Installation
+
+```
+npm install @material/theme
+```
+
+## Usage
+
+### Color Scheme
+
+You can define the theme color variables before importing any MDC Web components:
+
+```scss
+$mdc-theme-primary: #fcb8ab;
+$mdc-theme-secondary: #feeae6;
+$mdc-theme-on-primary: #442b2d;
+$mdc-theme-on-secondary: #442b2d;
+
+@import "@material/button/mdc-button";
+```
+
+We suggest you follow the Web Content Accessibility Guidelines 2.0 when picking the values for on-primary, on-secondary, etc. These values should be accessible on top of the corresponding value, e.g. primary and secondary.
+
+https://www.w3.org/TR/WCAG20
+
+### Advanced customization
+
+Color scheme will only get you 80% of the way to a well-designed app. Inevitably there will be some components that do not work "out of the box". To fix problems with accessibility and design, we suggest you use our Sass mixins, such as `mdc-button-filled-accessible`. For more information, consult the documentation for each component.
+
+### Non-Sass customization
+
+Only a very limited number of Material Design color customization features are supported for non-Sass clients. They are a set of CSS custom properties, and a set of CSS classes.
+
+#### CSS Custom Properties
+
+**A note about `<TEXT_STYLE>`**, `<TEXT_STYLE>` represents the lowercase name of the text styles listed above, e.g. `hint`.
+
+CSS Custom property | Description
+--- | ---
+`--mdc-theme-primary` | The theme primary color
+`--mdc-theme-secondary` | The theme secondary color
+`--mdc-theme-background` | The theme background color
+`--mdc-theme-surface` | The theme surface color
+`--mdc-theme-on-primary` | Text color on top of a primary background
+`--mdc-theme-on-secondary` | Text color on top of a secondary background
+`--mdc-theme-on-surface` | Text color on top of a surface background
+`--mdc-theme-text-<TEXT_STYLE>-on-light` | Text color for TEXT_STYLE on top of light background
+`--mdc-theme-text-<TEXT_STYLE>-on-dark` | Text color for TEXT_STYLE on top of dark background
+
+#### CSS Classes
+
+> **A note about `<TEXT_STYLE>`**, `<TEXT_STYLE>` represents the lowercase name of the text styles listed above, e.g. `hint`.
+
+CSS Class | Description
+--- | ---
+`mdc-theme--primary` | Sets the text color to the theme primary color
+`mdc-theme--secondary` | Sets the text color to the theme secondary color
+`mdc-theme--background` | Sets the background color to the theme background color
+`mdc-theme--surface` | Sets the surface color to the theme surface color
+`mdc-theme--on-primary` | Sets the text color to the theme on-primary color
+`mdc-theme--on-secondary` | Sets the text color to the theme on-secondary color
+`mdc-theme--on-surface` | Sets the text color to the theme on-surface color
+`mdc-theme--primary-bg` | Sets the background color to the theme primary color
+`mdc-theme--secondary-bg` | Sets the background color to the theme secondary color
+`mdc-theme--text-<TEXT_STYLE>-on-light` | Sets text to a suitable color for TEXT_STYLE on top of light background
+`mdc-theme--text-<TEXT_STYLE>-on-dark` | Sets text to a suitable color for TEXT_STYLE on top of dark background
+
+### Sass Mixins, Variables, and Functions
+
+Mixin | Description
+--- | ---
+`mdc-theme-prop($property, $style, $important, $edgeOptOut)` | Applies a theme color or a custom color to a CSS property, optionally with `!important`. If `$edgeOptOut` is `true` and a theme color is passed, the style will be wrapped in a `@supports` clause to exclude the style in Edge to avoid issues with its buggy CSS variable support.
+
+#### `mdc-theme-prop` Properties
+
+The properties below can be used as the `$style` argument for the `mdc-theme-prop` mixin. Literal color values (e.g., `rgba(0, 0, 0, .75)`) may also be used instead.
+
+**A note about `<TEXT_STYLE>`**, `<TEXT_STYLE>` represents the lowercase name of the text styles listed above, e.g. `hint`.
+
+Property Name | Description
+--- | ---
+`primary` | The theme primary color
+`secondary` | The theme secondary color
+`background` | The theme background color
+`surface` | The theme surface color
+`text-<TEXT_STYLE>-on-light` | TEXT_STYLE on top of a light background
+`text-<TEXT_STYLE>-on-dark` | TEXT_STYLE on top of a dark background
+`on-primary` | A text/iconography color that is usable on top of primary color
+`on-secondary` | A text/iconography color that is usable on top of secondary color
+`on-surface` | A text/iconography color that is usable on top of surface color
+
+
+#### `mdc-theme-luminance($color)`
+
+Calculates the luminance value (0 - 1) of a given color.
+
+```scss
+@debug mdc-theme-luminance(#9c27b0); // 0.11654
+```
+
+#### `mdc-theme-contrast($back, $front)`
+
+Calculates the contrast ratio between two colors.
+
+```scss
+@debug mdc-theme-contrast(#9c27b0, #000); // 3.33071
+```
+
+#### `mdc-theme-tone($color)`
+
+Determines whether the given color is "light" or "dark".
+
+If the input color is a string literal equal to `"light"` or `"dark"`, it will be returned verbatim.
+
+```scss
+@debug mdc-theme-tone(#9c27b0); // dark
+@debug mdc-theme-tone(light);   // light
+```
+
+#### `mdc-theme-contrast-tone($color)`
+
+Determines whether to use light or dark text on top of a given color.
+
+```scss
+@debug mdc-theme-contrast-tone(#9c27b0); // light
+```
+
+#### `mdc-theme-prop-value($style)`
+
+If `$style` is a color (a literal color value, `currentColor`, or a CSS custom property), it is returned verbatim.
+Otherwise, `$style` is treated as a theme property name, and the corresponding value from `$mdc-theme-property-values`
+is returned. If this also fails, an error is thrown.
+
+This is mainly useful in situations where `mdc-theme-prop` cannot be used directly (e.g., `box-shadow`).
+
+Unlike the `mdc-theme-prop` mixin, this function does _not_ support CSS custom properties.
+It only returns the raw color value of the specified theme property.
+
+> NOTE: This function is defined in `_variables.scss` instead of `_functions.scss` to avoid circular imports.
+
+```scss
+@debug mdc-theme-prop-value(primary); // #3f51b5
+@debug mdc-theme-prop-value(blue);    // blue
+```
+
+#### `mdc-theme-accessible-ink-color($fill-color, $text-style: primary)`
+
+Returns an accessible ink color that has sufficient contrast against the given fill color.
+
+Params:
+
+- `$fill-color`: Supports the same values as `mdc-theme-prop-value`
+- `$text-style`: Value must be one of `primary`, `secondary`, `hint`, `disabled`, `icon` (see `$mdc-theme-text-colors`)
+
+> NOTE: This function is defined in `_variables.scss` instead of `_functions.scss` to avoid circular imports.
+
+```scss
+@debug mdc-theme-accessible-ink-color(secondary); // rgba(0, 0, 0, .87) (text-primary-on-light)
+@debug mdc-theme-accessible-ink-color(blue);      // white              (text-primary-on-dark)
+```
diff --git a/node_modules/@material/textfield/node_modules/@material/theme/_color-palette.scss b/node_modules/@material/textfield/node_modules/@material/theme/_color-palette.scss
new file mode 100644
index 0000000..ef5122b
--- /dev/null
+++ b/node_modules/@material/textfield/node_modules/@material/theme/_color-palette.scss
@@ -0,0 +1,290 @@
+//
+// Copyright 2017 Google Inc. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+// stylelint-disable scss/dollar-variable-pattern, color-hex-length
+
+$material-color-red-50: #ffebee;
+$material-color-red-100: #ffcdd2;
+$material-color-red-200: #ef9a9a;
+$material-color-red-300: #e57373;
+$material-color-red-400: #ef5350;
+$material-color-red-500: #f44336;
+$material-color-red-600: #e53935;
+$material-color-red-700: #d32f2f;
+$material-color-red-800: #c62828;
+$material-color-red-900: #b71c1c;
+$material-color-red-a100: #ff8a80;
+$material-color-red-a200: #ff5252;
+$material-color-red-a400: #ff1744;
+$material-color-red-a700: #d50000;
+
+$material-color-pink-50: #fce4ec;
+$material-color-pink-100: #f8bbd0;
+$material-color-pink-200: #f48fb1;
+$material-color-pink-300: #f06292;
+$material-color-pink-400: #ec407a;
+$material-color-pink-500: #e91e63;
+$material-color-pink-600: #d81b60;
+$material-color-pink-700: #c2185b;
+$material-color-pink-800: #ad1457;
+$material-color-pink-900: #880e4f;
+$material-color-pink-a100: #ff80ab;
+$material-color-pink-a200: #ff4081;
+$material-color-pink-a400: #f50057;
+$material-color-pink-a700: #c51162;
+
+$material-color-purple-50: #f3e5f5;
+$material-color-purple-100: #e1bee7;
+$material-color-purple-200: #ce93d8;
+$material-color-purple-300: #ba68c8;
+$material-color-purple-400: #ab47bc;
+$material-color-purple-500: #9c27b0;
+$material-color-purple-600: #8e24aa;
+$material-color-purple-700: #7b1fa2;
+$material-color-purple-800: #6a1b9a;
+$material-color-purple-900: #4a148c;
+$material-color-purple-a100: #ea80fc;
+$material-color-purple-a200: #e040fb;
+$material-color-purple-a400: #d500f9;
+$material-color-purple-a700: #aa00ff;
+
+$material-color-deep-purple-50: #ede7f6;
+$material-color-deep-purple-100: #d1c4e9;
+$material-color-deep-purple-200: #b39ddb;
+$material-color-deep-purple-300: #9575cd;
+$material-color-deep-purple-400: #7e57c2;
+$material-color-deep-purple-500: #673ab7;
+$material-color-deep-purple-600: #5e35b1;
+$material-color-deep-purple-700: #512da8;
+$material-color-deep-purple-800: #4527a0;
+$material-color-deep-purple-900: #311b92;
+$material-color-deep-purple-a100: #b388ff;
+$material-color-deep-purple-a200: #7c4dff;
+$material-color-deep-purple-a400: #651fff;
+$material-color-deep-purple-a700: #6200ea;
+
+$material-color-indigo-50: #e8eaf6;
+$material-color-indigo-100: #c5cae9;
+$material-color-indigo-200: #9fa8da;
+$material-color-indigo-300: #7986cb;
+$material-color-indigo-400: #5c6bc0;
+$material-color-indigo-500: #3f51b5;
+$material-color-indigo-600: #3949ab;
+$material-color-indigo-700: #303f9f;
+$material-color-indigo-800: #283593;
+$material-color-indigo-900: #1a237e;
+$material-color-indigo-a100: #8c9eff;
+$material-color-indigo-a200: #536dfe;
+$material-color-indigo-a400: #3d5afe;
+$material-color-indigo-a700: #304ffe;
+
+$material-color-blue-50: #e3f2fd;
+$material-color-blue-100: #bbdefb;
+$material-color-blue-200: #90caf9;
+$material-color-blue-300: #64b5f6;
+$material-color-blue-400: #42a5f5;
+$material-color-blue-500: #2196f3;
+$material-color-blue-600: #1e88e5;
+$material-color-blue-700: #1976d2;
+$material-color-blue-800: #1565c0;
+$material-color-blue-900: #0d47a1;
+$material-color-blue-a100: #82b1ff;
+$material-color-blue-a200: #448aff;
+$material-color-blue-a400: #2979ff;
+$material-color-blue-a700: #2962ff;
+
+$material-color-light-blue-50: #e1f5fe;
+$material-color-light-blue-100: #b3e5fc;
+$material-color-light-blue-200: #81d4fa;
+$material-color-light-blue-300: #4fc3f7;
+$material-color-light-blue-400: #29b6f6;
+$material-color-light-blue-500: #03a9f4;
+$material-color-light-blue-600: #039be5;
+$material-color-light-blue-700: #0288d1;
+$material-color-light-blue-800: #0277bd;
+$material-color-light-blue-900: #01579b;
+$material-color-light-blue-a100: #80d8ff;
+$material-color-light-blue-a200: #40c4ff;
+$material-color-light-blue-a400: #00b0ff;
+$material-color-light-blue-a700: #0091ea;
+
+$material-color-cyan-50: #e0f7fa;
+$material-color-cyan-100: #b2ebf2;
+$material-color-cyan-200: #80deea;
+$material-color-cyan-300: #4dd0e1;
+$material-color-cyan-400: #26c6da;
+$material-color-cyan-500: #00bcd4;
+$material-color-cyan-600: #00acc1;
+$material-color-cyan-700: #0097a7;
+$material-color-cyan-800: #00838f;
+$material-color-cyan-900: #006064;
+$material-color-cyan-a100: #84ffff;
+$material-color-cyan-a200: #18ffff;
+$material-color-cyan-a400: #00e5ff;
+$material-color-cyan-a700: #00b8d4;
+
+$material-color-teal-50: #e0f2f1;
+$material-color-teal-100: #b2dfdb;
+$material-color-teal-200: #80cbc4;
+$material-color-teal-300: #4db6ac;
+$material-color-teal-400: #26a69a;
+$material-color-teal-500: #009688;
+$material-color-teal-600: #00897b;
+$material-color-teal-700: #00796b;
+$material-color-teal-800: #00695c;
+$material-color-teal-900: #004d40;
+$material-color-teal-a100: #a7ffeb;
+$material-color-teal-a200: #64ffda;
+$material-color-teal-a400: #1de9b6;
+$material-color-teal-a700: #00bfa5;
+
+$material-color-green-50: #e8f5e9;
+$material-color-green-100: #c8e6c9;
+$material-color-green-200: #a5d6a7;
+$material-color-green-300: #81c784;
+$material-color-green-400: #66bb6a;
+$material-color-green-500: #4caf50;
+$material-color-green-600: #43a047;
+$material-color-green-700: #388e3c;
+$material-color-green-800: #2e7d32;
+$material-color-green-900: #1b5e20;
+$material-color-green-a100: #b9f6ca;
+$material-color-green-a200: #69f0ae;
+$material-color-green-a400: #00e676;
+$material-color-green-a700: #00c853;
+
+$material-color-light-green-50: #f1f8e9;
+$material-color-light-green-100: #dcedc8;
+$material-color-light-green-200: #c5e1a5;
+$material-color-light-green-300: #aed581;
+$material-color-light-green-400: #9ccc65;
+$material-color-light-green-500: #8bc34a;
+$material-color-light-green-600: #7cb342;
+$material-color-light-green-700: #689f38;
+$material-color-light-green-800: #558b2f;
+$material-color-light-green-900: #33691e;
+$material-color-light-green-a100: #ccff90;
+$material-color-light-green-a200: #b2ff59;
+$material-color-light-green-a400: #76ff03;
+$material-color-light-green-a700: #64dd17;
+
+$material-color-lime-50: #f9fbe7;
+$material-color-lime-100: #f0f4c3;
+$material-color-lime-200: #e6ee9c;
+$material-color-lime-300: #dce775;
+$material-color-lime-400: #d4e157;
+$material-color-lime-500: #cddc39;
+$material-color-lime-600: #c0ca33;
+$material-color-lime-700: #afb42b;
+$material-color-lime-800: #9e9d24;
+$material-color-lime-900: #827717;
+$material-color-lime-a100: #f4ff81;
+$material-color-lime-a200: #eeff41;
+$material-color-lime-a400: #c6ff00;
+$material-color-lime-a700: #aeea00;
+
+$material-color-yellow-50: #fffde7;
+$material-color-yellow-100: #fff9c4;
+$material-color-yellow-200: #fff59d;
+$material-color-yellow-300: #fff176;
+$material-color-yellow-400: #ffee58;
+$material-color-yellow-500: #ffeb3b;
+$material-color-yellow-600: #fdd835;
+$material-color-yellow-700: #fbc02d;
+$material-color-yellow-800: #f9a825;
+$material-color-yellow-900: #f57f17;
+$material-color-yellow-a100: #ffff8d;
+$material-color-yellow-a200: #ffff00;
+$material-color-yellow-a400: #ffea00;
+$material-color-yellow-a700: #ffd600;
+
+$material-color-amber-50: #fff8e1;
+$material-color-amber-100: #ffecb3;
+$material-color-amber-200: #ffe082;
+$material-color-amber-300: #ffd54f;
+$material-color-amber-400: #ffca28;
+$material-color-amber-500: #ffc107;
+$material-color-amber-600: #ffb300;
+$material-color-amber-700: #ffa000;
+$material-color-amber-800: #ff8f00;
+$material-color-amber-900: #ff6f00;
+$material-color-amber-a100: #ffe57f;
+$material-color-amber-a200: #ffd740;
+$material-color-amber-a400: #ffc400;
+$material-color-amber-a700: #ffab00;
+
+$material-color-orange-50: #fff3e0;
+$material-color-orange-100: #ffe0b2;
+$material-color-orange-200: #ffcc80;
+$material-color-orange-300: #ffb74d;
+$material-color-orange-400: #ffa726;
+$material-color-orange-500: #ff9800;
+$material-color-orange-600: #fb8c00;
+$material-color-orange-700: #f57c00;
+$material-color-orange-800: #ef6c00;
+$material-color-orange-900: #e65100;
+$material-color-orange-a100: #ffd180;
+$material-color-orange-a200: #ffab40;
+$material-color-orange-a400: #ff9100;
+$material-color-orange-a700: #ff6d00;
+
+$material-color-deep-orange-50: #fbe9e7;
+$material-color-deep-orange-100: #ffccbc;
+$material-color-deep-orange-200: #ffab91;
+$material-color-deep-orange-300: #ff8a65;
+$material-color-deep-orange-400: #ff7043;
+$material-color-deep-orange-500: #ff5722;
+$material-color-deep-orange-600: #f4511e;
+$material-color-deep-orange-700: #e64a19;
+$material-color-deep-orange-800: #d84315;
+$material-color-deep-orange-900: #bf360c;
+$material-color-deep-orange-a100: #ff9e80;
+$material-color-deep-orange-a200: #ff6e40;
+$material-color-deep-orange-a400: #ff3d00;
+$material-color-deep-orange-a700: #dd2c00;
+
+$material-color-brown-50: #efebe9;
+$material-color-brown-100: #d7ccc8;
+$material-color-brown-200: #bcaaa4;
+$material-color-brown-300: #a1887f;
+$material-color-brown-400: #8d6e63;
+$material-color-brown-500: #795548;
+$material-color-brown-600: #6d4c41;
+$material-color-brown-700: #5d4037;
+$material-color-brown-800: #4e342e;
+$material-color-brown-900: #3e2723;
+
+$material-color-grey-50: #fafafa;
+$material-color-grey-100: #f5f5f5;
+$material-color-grey-200: #eeeeee;
+$material-color-grey-300: #e0e0e0;
+$material-color-grey-400: #bdbdbd;
+$material-color-grey-500: #9e9e9e;
+$material-color-grey-600: #757575;
+$material-color-grey-700: #616161;
+$material-color-grey-800: #424242;
+$material-color-grey-900: #212121;
+
+$material-color-blue-grey-50: #eceff1;
+$material-color-blue-grey-100: #cfd8dc;
+$material-color-blue-grey-200: #b0bec5;
+$material-color-blue-grey-300: #90a4ae;
+$material-color-blue-grey-400: #78909c;
+$material-color-blue-grey-500: #607d8b;
+$material-color-blue-grey-600: #546e7a;
+$material-color-blue-grey-700: #455a64;
+$material-color-blue-grey-800: #37474f;
+$material-color-blue-grey-900: #263238;
diff --git a/node_modules/@material/textfield/node_modules/@material/theme/_constants.scss b/node_modules/@material/textfield/node_modules/@material/theme/_constants.scss
new file mode 100644
index 0000000..baa150d
--- /dev/null
+++ b/node_modules/@material/textfield/node_modules/@material/theme/_constants.scss
@@ -0,0 +1,283 @@
+//
+// Copyright 2017 Google Inc. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+// Precomputed linear color channel values, for use in contrast calculations.
+// See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+//
+// Algorithm, for c in 0 to 255:
+// f(c) {
+//   c = c / 255;
+//   return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+// }
+//
+// This lookup table is needed since there is no `pow` in SASS.
+$mdc-theme-linear-channel-values:
+  0
+  .0003035269835488375
+  .000607053967097675
+  .0009105809506465125
+  .00121410793419535
+  .0015176349177441874
+  .001821161901293025
+  .0021246888848418626
+  .0024282158683907
+  .0027317428519395373
+  .003035269835488375
+  .003346535763899161
+  .003676507324047436
+  .004024717018496307
+  .004391442037410293
+  .004776953480693729
+  .005181516702338386
+  .005605391624202723
+  .006048833022857054
+  .006512090792594475
+  .006995410187265387
+  .007499032043226175
+  .008023192985384994
+  .008568125618069307
+  .009134058702220787
+  .00972121732023785
+  .010329823029626936
+  .010960094006488246
+  .011612245179743885
+  .012286488356915872
+  .012983032342173012
+  .013702083047289686
+  .014443843596092545
+  .01520851442291271
+  .01599629336550963
+  .016807375752887384
+  .017641954488384078
+  .018500220128379697
+  .019382360956935723
+  .0202885630566524
+  .021219010376003555
+  .022173884793387385
+  .02315336617811041
+  .024157632448504756
+  .02518685962736163
+  .026241221894849898
+  .027320891639074894
+  .028426039504420793
+  .0295568344378088
+  .030713443732993635
+  .03189603307301153
+  .033104766570885055
+  .03433980680868217
+  .03560131487502034
+  .03688945040110004
+  .0382043715953465
+  .03954623527673284
+  .04091519690685319
+  .042311410620809675
+  .043735029256973465
+  .04518620438567554
+  .046665086336880095
+  .04817182422688942
+  .04970656598412723
+  .05126945837404324
+  .052860647023180246
+  .05448027644244237
+  .05612849004960009
+  .05780543019106723
+  .0595112381629812
+  .06124605423161761
+  .06301001765316767
+  .06480326669290577
+  .06662593864377289
+  .06847816984440017
+  .07036009569659588
+  .07227185068231748
+  .07421356838014963
+  .07618538148130785
+  .07818742180518633
+  .08021982031446832
+  .0822827071298148
+  .08437621154414882
+  .08650046203654976
+  .08865558628577294
+  .09084171118340768
+  .09305896284668745
+  .0953074666309647
+  .09758734714186246
+  .09989872824711389
+  .10224173308810132
+  .10461648409110419
+  .10702310297826761
+  .10946171077829933
+  .1119324278369056
+  .11443537382697373
+  .11697066775851084
+  .11953842798834562
+  .12213877222960187
+  .12477181756095049
+  .12743768043564743
+  .1301364766903643
+  .13286832155381798
+  .13563332965520566
+  .13843161503245183
+  .14126329114027164
+  .14412847085805777
+  .14702726649759498
+  .14995978981060856
+  .15292615199615017
+  .1559264637078274
+  .1589608350608804
+  .162029375639111
+  .1651321945016676
+  .16826940018969075
+  .1714411007328226
+  .17464740365558504
+  .17788841598362912
+  .18116424424986022
+  .184474994500441
+  .18782077230067787
+  .19120168274079138
+  .1946178304415758
+  .19806931955994886
+  .20155625379439707
+  .20507873639031693
+  .20863687014525575
+  .21223075741405523
+  .21586050011389926
+  .2195261997292692
+  .2232279573168085
+  .22696587351009836
+  .23074004852434915
+  .23455058216100522
+  .238397573812271
+  .24228112246555486
+  .24620132670783548
+  .25015828472995344
+  .25415209433082675
+  .2581828529215958
+  .26225065752969623
+  .26635560480286247
+  .2704977910130658
+  .27467731206038465
+  .2788942634768104
+  .2831487404299921
+  .2874408377269175
+  .29177064981753587
+  .2961382707983211
+  .3005437944157765
+  .3049873140698863
+  .30946892281750854
+  .31398871337571754
+  .31854677812509186
+  .32314320911295075
+  .3277780980565422
+  .33245153634617935
+  .33716361504833037
+  .3419144249086609
+  .3467040563550296
+  .35153259950043936
+  .3564001441459435
+  .3613067797835095
+  .3662525955988395
+  .3712376804741491
+  .3762621229909065
+  .38132601143253014
+  .386429433787049
+  .39157247774972326
+  .39675523072562685
+  .4019777798321958
+  .4072402119017367
+  .41254261348390375
+  .4178850708481375
+  .4232676699860717
+  .4286904966139066
+  .43415363617474895
+  .4396571738409188
+  .44520119451622786
+  .45078578283822346
+  .45641102318040466
+  .4620769996544071
+  .467783796112159
+  .47353149614800955
+  .4793201831008268
+  .4851499400560704
+  .4910208498478356
+  .4969329950608704
+  .5028864580325687
+  .5088813208549338
+  .5149176653765214
+  .5209955732043543
+  .5271151257058131
+  .5332764040105052
+  .5394794890121072
+  .5457244613701866
+  .5520114015120001
+  .5583403896342679
+  .5647115057049292
+  .5711248294648731
+  .5775804404296506
+  .5840784178911641
+  .5906188409193369
+  .5972017883637634
+  .6038273388553378
+  .6104955708078648
+  .6172065624196511
+  .6239603916750761
+  .6307571363461468
+  .6375968739940326
+  .6444796819705821
+  .6514056374198242
+  .6583748172794485
+  .665387298282272
+  .6724431569576875
+  .6795424696330938
+  .6866853124353135
+  .6938717612919899
+  .7011018919329731
+  .7083757798916868
+  .7156935005064807
+  .7230551289219693
+  .7304607400903537
+  .7379104087727308
+  .7454042095403874
+  .7529422167760779
+  .7605245046752924
+  .768151147247507
+  .7758222183174236
+  .7835377915261935
+  .7912979403326302
+  .799102738014409
+  .8069522576692516
+  .8148465722161012
+  .8227857543962835
+  .8307698767746546
+  .83879901174074
+  .846873231509858
+  .8549926081242338
+  .8631572134541023
+  .8713671191987972
+  .8796223968878317
+  .8879231178819663
+  .8962693533742664
+  .9046611743911496
+  .9130986517934192
+  .9215818562772946
+  .9301108583754237
+  .938685728457888
+  .9473065367331999
+  .9559733532492861
+  .9646862478944651
+  .9734452903984125
+  .9822505503331171
+  .9911020971138298
+  1;
diff --git a/node_modules/@material/textfield/node_modules/@material/theme/_functions.scss b/node_modules/@material/textfield/node_modules/@material/theme/_functions.scss
new file mode 100644
index 0000000..acf2ff7
--- /dev/null
+++ b/node_modules/@material/textfield/node_modules/@material/theme/_functions.scss
@@ -0,0 +1,60 @@
+//
+// Copyright 2017 Google Inc. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+@import "./constants";
+
+// Calculate the luminance for a color.
+// See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+@function mdc-theme-luminance($color) {
+  $red: nth($mdc-theme-linear-channel-values, red($color) + 1);
+  $green: nth($mdc-theme-linear-channel-values, green($color) + 1);
+  $blue: nth($mdc-theme-linear-channel-values, blue($color) + 1);
+
+  @return .2126 * $red + .7152 * $green + .0722 * $blue;
+}
+
+// Calculate the contrast ratio between two colors.
+// See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+@function mdc-theme-contrast($back, $front) {
+  $backLum: mdc-theme-luminance($back) + .05;
+  $foreLum: mdc-theme-luminance($front) + .05;
+
+  @return max($backLum, $foreLum) / min($backLum, $foreLum);
+}
+
+// Determine whether the color is "light" or "dark".
+@function mdc-theme-tone($color) {
+  @if $color == "dark" or $color == "light" {
+    @return $color;
+  }
+
+  $minimumContrast: 3.1;
+
+  $lightContrast: mdc-theme-contrast($color, white);
+  $darkContrast: mdc-theme-contrast($color, rgba(black, .87));
+
+  @if ($lightContrast < $minimumContrast) and ($darkContrast > $lightContrast) {
+    @return "light";
+  } @else {
+    @return "dark";
+  }
+}
+
+// Determine whether to use dark or light text on top of given color to meet accessibility standards for contrast.
+// Returns "dark" if the given color is light and "light" if the given color is dark.
+@function mdc-theme-contrast-tone($color) {
+  @return if(mdc-theme-tone($color) == "dark", "light", "dark");
+}
diff --git a/node_modules/@material/textfield/node_modules/@material/theme/_mixins.scss b/node_modules/@material/textfield/node_modules/@material/theme/_mixins.scss
new file mode 100644
index 0000000..9510df2
--- /dev/null
+++ b/node_modules/@material/textfield/node_modules/@material/theme/_mixins.scss
@@ -0,0 +1,80 @@
+//
+// Copyright 2017 Google Inc. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+@import "./variables";
+
+// Applies the correct theme color style to the specified property.
+// $property is typically color or background-color, but can be any CSS property that accepts color values.
+// $style should be one of the map keys in $mdc-theme-property-values (_variables.scss), or a color value.
+// $edgeOptOut controls whether to feature-detect around Edge to avoid emitting CSS variables for it,
+// intended for use in cases where interactions with pseudo-element styles cause problems due to Edge bugs.
+@mixin mdc-theme-prop($property, $style, $important: false, $edgeOptOut: false) {
+  @if mdc-theme-is-valid-theme-prop-value_($style) {
+    @if $important {
+      #{$property}: $style !important;
+    } @else {
+      #{$property}: $style;
+    }
+  } @else {
+    @if not map-has-key($mdc-theme-property-values, $style) {
+      @error "Invalid style: '#{$style}'. Choose one of: #{map-keys($mdc-theme-property-values)}";
+    }
+
+    $value: map-get($mdc-theme-property-values, $style);
+
+    @if $important {
+      #{$property}: $value !important;
+
+      @if $edgeOptOut {
+        // stylelint-disable max-nesting-depth
+        @at-root {
+          @supports not (-ms-ime-align:auto) {
+            // stylelint-disable scss/selector-no-redundant-nesting-selector
+            & {
+              /* @alternate */
+              #{$property}: var(--mdc-theme-#{$style}, $value) !important;
+            }
+            // stylelint-enable scss/selector-no-redundant-nesting-selector
+          }
+        }
+        // stylelint-enable max-nesting-depth
+      } @else {
+        /* @alternate */
+        #{$property}: var(--mdc-theme-#{$style}, $value) !important;
+      }
+    } @else {
+      #{$property}: $value;
+
+      @if $edgeOptOut {
+        // stylelint-disable max-nesting-depth
+        @at-root {
+          @supports not (-ms-ime-align:auto) {
+            // stylelint-disable scss/selector-no-redundant-nesting-selector
+            & {
+              /* @alternate */
+              #{$property}: var(--mdc-theme-#{$style}, $value);
+            }
+            // stylelint-enable scss/selector-no-redundant-nesting-selector
+          }
+        }
+        // stylelint-enable max-nesting-depth
+      } @else {
+        /* @alternate */
+        #{$property}: var(--mdc-theme-#{$style}, $value);
+      }
+    }
+  }
+}
diff --git a/node_modules/@material/textfield/node_modules/@material/theme/_variables.scss b/node_modules/@material/textfield/node_modules/@material/theme/_variables.scss
new file mode 100644
index 0000000..8c962f3
--- /dev/null
+++ b/node_modules/@material/textfield/node_modules/@material/theme/_variables.scss
@@ -0,0 +1,140 @@
+//
+// Copyright 2017 Google Inc. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+@import "./functions";
+
+//
+// Main theme colors for your brand.
+//
+// If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+//
+
+$mdc-theme-primary: #6200ee !default; // baseline purple, 500 tone
+$mdc-theme-on-primary: if(mdc-theme-contrast-tone($mdc-theme-primary) == "dark", #000, #fff) !default;
+
+// The $mdc-theme-accent variable is DEPRECATED - it exists purely for backward compatibility.
+// The $mdc-theme-secondary* variables should be used for all new projects.
+$mdc-theme-accent: #018786 !default; // baseline teal, 600 tone
+$mdc-theme-secondary: $mdc-theme-accent !default;
+$mdc-theme-on-secondary: if(mdc-theme-contrast-tone($mdc-theme-secondary) == "dark", #000, #fff) !default;
+$mdc-theme-background: #fff !default; // White
+
+$mdc-theme-surface: #fff !default;
+$mdc-theme-on-surface: if(mdc-theme-contrast-tone($mdc-theme-surface) == "dark", #000, #fff) !default;
+
+//
+// Text colors according to light vs dark and text type.
+//
+
+$mdc-theme-text-colors: (
+  dark: (
+    primary: rgba(black, .87),
+    secondary: rgba(black, .54),
+    hint: rgba(black, .38),
+    disabled: rgba(black, .38),
+    icon: rgba(black, .38)
+  ),
+  light: (
+    primary: white,
+    secondary: rgba(white, .7),
+    hint: rgba(white, .5),
+    disabled: rgba(white, .5),
+    icon: rgba(white, .5)
+  )
+) !default;
+
+@function mdc-theme-ink-color-for-fill_($text-style, $fill-color) {
+  $contrast-tone: mdc-theme-contrast-tone($fill-color);
+
+  @return map-get(map-get($mdc-theme-text-colors, $contrast-tone), $text-style);
+}
+
+//
+// Primary text colors for each of the theme colors.
+//
+
+$mdc-theme-property-values: (
+  // Primary
+  primary: $mdc-theme-primary,
+  // Secondary
+  secondary: $mdc-theme-secondary,
+  // Background
+  background: $mdc-theme-background,
+  // Surface
+  surface: $mdc-theme-surface,
+  on-primary: $mdc-theme-on-primary,
+  on-secondary: $mdc-theme-on-secondary,
+  on-surface: $mdc-theme-on-surface,
+  // Text-primary on "background" background
+  text-primary-on-background: mdc-theme-ink-color-for-fill_(primary, $mdc-theme-background),
+  text-secondary-on-background: mdc-theme-ink-color-for-fill_(secondary, $mdc-theme-background),
+  text-hint-on-background: mdc-theme-ink-color-for-fill_(hint, $mdc-theme-background),
+  text-disabled-on-background: mdc-theme-ink-color-for-fill_(disabled, $mdc-theme-background),
+  text-icon-on-background: mdc-theme-ink-color-for-fill_(icon, $mdc-theme-background),
+  // Text-primary on "light" background
+  text-primary-on-light: mdc-theme-ink-color-for-fill_(primary, light),
+  text-secondary-on-light: mdc-theme-ink-color-for-fill_(secondary, light),
+  text-hint-on-light: mdc-theme-ink-color-for-fill_(hint, light),
+  text-disabled-on-light: mdc-theme-ink-color-for-fill_(disabled, light),
+  text-icon-on-light: mdc-theme-ink-color-for-fill_(icon, light),
+  // Text-primary on "dark" background
+  text-primary-on-dark: mdc-theme-ink-color-for-fill_(primary, dark),
+  text-secondary-on-dark: mdc-theme-ink-color-for-fill_(secondary, dark),
+  text-hint-on-dark: mdc-theme-ink-color-for-fill_(hint, dark),
+  text-disabled-on-dark: mdc-theme-ink-color-for-fill_(disabled, dark),
+  text-icon-on-dark: mdc-theme-ink-color-for-fill_(icon, dark)
+);
+
+// If `$style` is a color (a literal color value, `currentColor`, or a CSS custom property), it is returned verbatim.
+// Otherwise, `$style` is treated as a theme property name, and the corresponding value from
+// `$mdc-theme-property-values` is returned. If this also fails, an error is thrown.
+//
+// This is mainly useful in situations where `mdc-theme-prop` cannot be used directly (e.g., `box-shadow`).
+//
+// Examples:
+//
+// 1. mdc-theme-prop-value(primary) => "#6200ee"
+// 2. mdc-theme-prop-value(blue)    => "blue"
+//
+// NOTE: This function must be defined in _variables.scss instead of _functions.scss to avoid circular imports.
+@function mdc-theme-prop-value($style) {
+  @if mdc-theme-is-valid-theme-prop-value_($style) {
+    @return $style;
+  }
+
+  @if not map-has-key($mdc-theme-property-values, $style) {
+    @error "Invalid theme property: '#{$style}'. Choose one of: #{map-keys($mdc-theme-property-values)}";
+  }
+
+  @return map-get($mdc-theme-property-values, $style);
+}
+
+// NOTE: This function must be defined in _variables.scss instead of _functions.scss to avoid circular imports.
+@function mdc-theme-accessible-ink-color($fill-color, $text-style: primary) {
+  $fill-color-value: mdc-theme-prop-value($fill-color);
+  $color-map-for-tone: map-get($mdc-theme-text-colors, mdc-theme-contrast-tone($fill-color-value));
+
+  @if not map-has-key($color-map-for-tone, $text-style) {
+    @error "Invalid $text-style: '#{$text-style}'. Choose one of: #{map-keys($color-map-for-tone)}";
+  }
+
+  @return map-get($color-map-for-tone, $text-style);
+}
+
+// NOTE: This function is depended upon by mdc-theme-prop-value (above) and thus must be defined in this file.
+@function mdc-theme-is-valid-theme-prop-value_($style) {
+  @return type-of($style) == "color" or $style == "currentColor" or str_slice($style, 1, 4) == "var(";
+}
diff --git a/node_modules/@material/textfield/node_modules/@material/theme/dist/mdc.theme.css b/node_modules/@material/textfield/node_modules/@material/theme/dist/mdc.theme.css
new file mode 100644
index 0000000..9d4696f
--- /dev/null
+++ b/node_modules/@material/textfield/node_modules/@material/theme/dist/mdc.theme.css
@@ -0,0 +1,150 @@
+/*!
+ Material Components for the Web
+ Copyright (c) 2018 Google Inc.
+ License: Apache-2.0
+*/
+:root {
+  --mdc-theme-primary: #6200ee;
+  --mdc-theme-secondary: #018786;
+  --mdc-theme-background: #fff;
+  --mdc-theme-surface: #fff;
+  --mdc-theme-on-primary: #fff;
+  --mdc-theme-on-secondary: #fff;
+  --mdc-theme-on-surface: #000;
+  --mdc-theme-text-primary-on-background: rgba(0, 0, 0, 0.87);
+  --mdc-theme-text-secondary-on-background: rgba(0, 0, 0, 0.54);
+  --mdc-theme-text-hint-on-background: rgba(0, 0, 0, 0.38);
+  --mdc-theme-text-disabled-on-background: rgba(0, 0, 0, 0.38);
+  --mdc-theme-text-icon-on-background: rgba(0, 0, 0, 0.38);
+  --mdc-theme-text-primary-on-light: rgba(0, 0, 0, 0.87);
+  --mdc-theme-text-secondary-on-light: rgba(0, 0, 0, 0.54);
+  --mdc-theme-text-hint-on-light: rgba(0, 0, 0, 0.38);
+  --mdc-theme-text-disabled-on-light: rgba(0, 0, 0, 0.38);
+  --mdc-theme-text-icon-on-light: rgba(0, 0, 0, 0.38);
+  --mdc-theme-text-primary-on-dark: white;
+  --mdc-theme-text-secondary-on-dark: rgba(255, 255, 255, 0.7);
+  --mdc-theme-text-hint-on-dark: rgba(255, 255, 255, 0.5);
+  --mdc-theme-text-disabled-on-dark: rgba(255, 255, 255, 0.5);
+  --mdc-theme-text-icon-on-dark: rgba(255, 255, 255, 0.5); }
+
+.mdc-theme--primary {
+  color: #6200ee !important;
+  /* @alternate */
+  color: var(--mdc-theme-primary, #6200ee) !important; }
+
+.mdc-theme--secondary {
+  color: #018786 !important;
+  /* @alternate */
+  color: var(--mdc-theme-secondary, #018786) !important; }
+
+.mdc-theme--background {
+  background-color: #fff;
+  /* @alternate */
+  background-color: var(--mdc-theme-background, #fff); }
+
+.mdc-theme--surface {
+  background-color: #fff;
+  /* @alternate */
+  background-color: var(--mdc-theme-surface, #fff); }
+
+.mdc-theme--on-primary {
+  color: #fff !important;
+  /* @alternate */
+  color: var(--mdc-theme-on-primary, #fff) !important; }
+
+.mdc-theme--on-secondary {
+  color: #fff !important;
+  /* @alternate */
+  color: var(--mdc-theme-on-secondary, #fff) !important; }
+
+.mdc-theme--on-surface {
+  color: #000 !important;
+  /* @alternate */
+  color: var(--mdc-theme-on-surface, #000) !important; }
+
+.mdc-theme--text-primary-on-background {
+  color: rgba(0, 0, 0, 0.87) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-primary-on-background, rgba(0, 0, 0, 0.87)) !important; }
+
+.mdc-theme--text-secondary-on-background {
+  color: rgba(0, 0, 0, 0.54) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-secondary-on-background, rgba(0, 0, 0, 0.54)) !important; }
+
+.mdc-theme--text-hint-on-background {
+  color: rgba(0, 0, 0, 0.38) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-hint-on-background, rgba(0, 0, 0, 0.38)) !important; }
+
+.mdc-theme--text-disabled-on-background {
+  color: rgba(0, 0, 0, 0.38) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-disabled-on-background, rgba(0, 0, 0, 0.38)) !important; }
+
+.mdc-theme--text-icon-on-background {
+  color: rgba(0, 0, 0, 0.38) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-icon-on-background, rgba(0, 0, 0, 0.38)) !important; }
+
+.mdc-theme--text-primary-on-light {
+  color: rgba(0, 0, 0, 0.87) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-primary-on-light, rgba(0, 0, 0, 0.87)) !important; }
+
+.mdc-theme--text-secondary-on-light {
+  color: rgba(0, 0, 0, 0.54) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-secondary-on-light, rgba(0, 0, 0, 0.54)) !important; }
+
+.mdc-theme--text-hint-on-light {
+  color: rgba(0, 0, 0, 0.38) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-hint-on-light, rgba(0, 0, 0, 0.38)) !important; }
+
+.mdc-theme--text-disabled-on-light {
+  color: rgba(0, 0, 0, 0.38) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-disabled-on-light, rgba(0, 0, 0, 0.38)) !important; }
+
+.mdc-theme--text-icon-on-light {
+  color: rgba(0, 0, 0, 0.38) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-icon-on-light, rgba(0, 0, 0, 0.38)) !important; }
+
+.mdc-theme--text-primary-on-dark {
+  color: white !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-primary-on-dark, white) !important; }
+
+.mdc-theme--text-secondary-on-dark {
+  color: rgba(255, 255, 255, 0.7) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-secondary-on-dark, rgba(255, 255, 255, 0.7)) !important; }
+
+.mdc-theme--text-hint-on-dark {
+  color: rgba(255, 255, 255, 0.5) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-hint-on-dark, rgba(255, 255, 255, 0.5)) !important; }
+
+.mdc-theme--text-disabled-on-dark {
+  color: rgba(255, 255, 255, 0.5) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-disabled-on-dark, rgba(255, 255, 255, 0.5)) !important; }
+
+.mdc-theme--text-icon-on-dark {
+  color: rgba(255, 255, 255, 0.5) !important;
+  /* @alternate */
+  color: var(--mdc-theme-text-icon-on-dark, rgba(255, 255, 255, 0.5)) !important; }
+
+.mdc-theme--primary-bg {
+  background-color: #6200ee !important;
+  /* @alternate */
+  background-color: var(--mdc-theme-primary, #6200ee) !important; }
+
+.mdc-theme--secondary-bg {
+  background-color: #018786 !important;
+  /* @alternate */
+  background-color: var(--mdc-theme-secondary, #018786) !important; }
+
+/*# sourceMappingURL=mdc.theme.css.map*/
\ No newline at end of file
diff --git a/node_modules/@material/textfield/node_modules/@material/theme/dist/mdc.theme.min.css b/node_modules/@material/textfield/node_modules/@material/theme/dist/mdc.theme.min.css
new file mode 100644
index 0000000..88b38e2
--- /dev/null
+++ b/node_modules/@material/textfield/node_modules/@material/theme/dist/mdc.theme.min.css
@@ -0,0 +1,8 @@
+/*!
+ Material Components for the Web
+ Copyright (c) 2018 Google Inc.
+ License: Apache-2.0
+*/
+:root{--mdc-theme-primary: #6200ee;--mdc-theme-secondary: #018786;--mdc-theme-background: #fff;--mdc-theme-surface: #fff;--mdc-theme-on-primary: #fff;--mdc-theme-on-secondary: #fff;--mdc-theme-on-surface: #000;--mdc-theme-text-primary-on-background: rgba(0,0,0,0.87);--mdc-theme-text-secondary-on-background: rgba(0,0,0,0.54);--mdc-theme-text-hint-on-background: rgba(0,0,0,0.38);--mdc-theme-text-disabled-on-background: rgba(0,0,0,0.38);--mdc-theme-text-icon-on-background: rgba(0,0,0,0.38);--mdc-theme-text-primary-on-light: rgba(0,0,0,0.87);--mdc-theme-text-secondary-on-light: rgba(0,0,0,0.54);--mdc-theme-text-hint-on-light: rgba(0,0,0,0.38);--mdc-theme-text-disabled-on-light: rgba(0,0,0,0.38);--mdc-theme-text-icon-on-light: rgba(0,0,0,0.38);--mdc-theme-text-primary-on-dark: #fff;--mdc-theme-text-secondary-on-dark: rgba(255,255,255,0.7);--mdc-theme-text-hint-on-dark: rgba(255,255,255,0.5);--mdc-theme-text-disabled-on-dark: rgba(255,255,255,0.5);--mdc-theme-text-icon-on-dark: rgba(255,255,255,0.5)}.mdc-theme--primary{color:#6200ee !important;color:var(--mdc-theme-primary, #6200ee) !important}.mdc-theme--secondary{color:#018786 !important;color:var(--mdc-theme-secondary, #018786) !important}.mdc-theme--background{background-color:#fff;background-color:var(--mdc-theme-background, #fff)}.mdc-theme--surface{background-color:#fff;background-color:var(--mdc-theme-surface, #fff)}.mdc-theme--on-primary{color:#fff !important;color:var(--mdc-theme-on-primary, #fff) !important}.mdc-theme--on-secondary{color:#fff !important;color:var(--mdc-theme-on-secondary, #fff) !important}.mdc-theme--on-surface{color:#000 !important;color:var(--mdc-theme-on-surface, #000) !important}.mdc-theme--text-primary-on-background{color:rgba(0,0,0,0.87) !important;color:var(--mdc-theme-text-primary-on-background, rgba(0,0,0,0.87)) !important}.mdc-theme--text-secondary-on-background{color:rgba(0,0,0,0.54) !important;color:var(--mdc-theme-text-secondary-on-background, rgba(0,0,0,0.54)) !important}.mdc-theme--text-hint-on-background{color:rgba(0,0,0,0.38) !important;color:var(--mdc-theme-text-hint-on-background, rgba(0,0,0,0.38)) !important}.mdc-theme--text-disabled-on-background{color:rgba(0,0,0,0.38) !important;color:var(--mdc-theme-text-disabled-on-background, rgba(0,0,0,0.38)) !important}.mdc-theme--text-icon-on-background{color:rgba(0,0,0,0.38) !important;color:var(--mdc-theme-text-icon-on-background, rgba(0,0,0,0.38)) !important}.mdc-theme--text-primary-on-light{color:rgba(0,0,0,0.87) !important;color:var(--mdc-theme-text-primary-on-light, rgba(0,0,0,0.87)) !important}.mdc-theme--text-secondary-on-light{color:rgba(0,0,0,0.54) !important;color:var(--mdc-theme-text-secondary-on-light, rgba(0,0,0,0.54)) !important}.mdc-theme--text-hint-on-light{color:rgba(0,0,0,0.38) !important;color:var(--mdc-theme-text-hint-on-light, rgba(0,0,0,0.38)) !important}.mdc-theme--text-disabled-on-light{color:rgba(0,0,0,0.38) !important;color:var(--mdc-theme-text-disabled-on-light, rgba(0,0,0,0.38)) !important}.mdc-theme--text-icon-on-light{color:rgba(0,0,0,0.38) !important;color:var(--mdc-theme-text-icon-on-light, rgba(0,0,0,0.38)) !important}.mdc-theme--text-primary-on-dark{color:#fff !important;color:var(--mdc-theme-text-primary-on-dark, #fff) !important}.mdc-theme--text-secondary-on-dark{color:rgba(255,255,255,0.7) !important;color:var(--mdc-theme-text-secondary-on-dark, rgba(255,255,255,0.7)) !important}.mdc-theme--text-hint-on-dark{color:rgba(255,255,255,0.5) !important;color:var(--mdc-theme-text-hint-on-dark, rgba(255,255,255,0.5)) !important}.mdc-theme--text-disabled-on-dark{color:rgba(255,255,255,0.5) !important;color:var(--mdc-theme-text-disabled-on-dark, rgba(255,255,255,0.5)) !important}.mdc-theme--text-icon-on-dark{color:rgba(255,255,255,0.5) !important;color:var(--mdc-theme-text-icon-on-dark, rgba(255,255,255,0.5)) !important}.mdc-theme--primary-bg{background-color:#6200ee !important;background-color:var(--mdc-theme-primary, #6200ee) !important}.mdc-theme--secondary-bg{background-color:#018786 !important;background-color:var(--mdc-theme-secondary, #018786) !important}
+
+/*# sourceMappingURL=mdc.theme.min.css.map*/
\ No newline at end of file
diff --git a/node_modules/@material/textfield/node_modules/@material/theme/mdc-theme.scss b/node_modules/@material/textfield/node_modules/@material/theme/mdc-theme.scss
new file mode 100644
index 0000000..759aae8
--- /dev/null
+++ b/node_modules/@material/textfield/node_modules/@material/theme/mdc-theme.scss
@@ -0,0 +1,42 @@
+//
+// Copyright 2017 Google Inc. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+@import "./mixins";
+
+:root {
+  @each $style in map-keys($mdc-theme-property-values) {
+    --mdc-theme-#{$style}: #{map-get($mdc-theme-property-values, $style)};
+  }
+}
+
+@each $style in map-keys($mdc-theme-property-values) {
+  @if $style != "background" and $style != "surface" {
+    .mdc-theme--#{$style} {
+      @include mdc-theme-prop(color, $style, true);
+    }
+  } @else {
+    .mdc-theme--#{$style} {
+      @include mdc-theme-prop(background-color, $style);
+    }
+  }
+}
+
+// CSS rules for using primary and secondary (plus light/dark variants) as background colors.
+@each $style in ("primary", "secondary") {
+  .mdc-theme--#{$style}-bg {
+    @include mdc-theme-prop(background-color, $style, true);
+  }
+}
diff --git a/node_modules/@material/textfield/node_modules/@material/theme/package.json b/node_modules/@material/textfield/node_modules/@material/theme/package.json
new file mode 100644
index 0000000..34e7479
--- /dev/null
+++ b/node_modules/@material/textfield/node_modules/@material/theme/package.json
@@ -0,0 +1,46 @@
+{
+  "_from": "@material/theme@^0.38.0",
+  "_id": "@material/theme@0.38.0",
+  "_inBundle": false,
+  "_integrity": "sha512-mP5+qgICPm/0dD3hKa/hMd8AHerkAaLJgEsvBwTXi+N/kpPo9LIrHg40DvUGPs5w6KD9PUuskb3WGBvYcToHvA==",
+  "_location": "/@material/textfield/@material/theme",
+  "_phantomChildren": {},
+  "_requested": {
+    "type": "range",
+    "registry": true,
+    "raw": "@material/theme@^0.38.0",
+    "name": "@material/theme",
+    "escapedName": "@material%2ftheme",
+    "scope": "@material",
+    "rawSpec": "^0.38.0",
+    "saveSpec": null,
+    "fetchSpec": "^0.38.0"
+  },
+  "_requiredBy": [
+    "/@material/textfield",
+    "/@material/textfield/@material/ripple"
+  ],
+  "_resolved": "https://registry.npmjs.org/@material/theme/-/theme-0.38.0.tgz",
+  "_shasum": "c1a2247eba4af2ba47da4456921ab420869fda55",
+  "_spec": "@material/theme@^0.38.0",
+  "_where": "C:\\Users\\jakch\\github\\tool-hub\\node_modules\\@material\\textfield",
+  "bugs": {
+    "url": "https://github.com/material-components/material-components-web/issues"
+  },
+  "bundleDependencies": false,
+  "deprecated": false,
+  "description": "The Material Components for the web theming system",
+  "homepage": "https://github.com/material-components/material-components-web#readme",
+  "keywords": [
+    "material components",
+    "material design",
+    "theme"
+  ],
+  "license": "Apache-2.0",
+  "name": "@material/theme",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/material-components/material-components-web.git"
+  },
+  "version": "0.38.0"
+}
diff --git a/node_modules/@material/textfield/package.json b/node_modules/@material/textfield/package.json
new file mode 100644
index 0000000..513e63d
--- /dev/null
+++ b/node_modules/@material/textfield/package.json
@@ -0,0 +1,62 @@
+{
+  "_from": "@material/textfield",
+  "_id": "@material/textfield@0.38.1",
+  "_inBundle": false,
+  "_integrity": "sha512-ymgDVc1W0ToMVnzfjlhATXHgVDST3zqMKfrI7u4eHkXm5v4eaH2SWlIUDBJDUAKtvcHq1BmAhzB3CcWweLw0qw==",
+  "_location": "/@material/textfield",
+  "_phantomChildren": {
+    "@material/animation": "0.34.0",
+    "@material/base": "0.35.0"
+  },
+  "_requested": {
+    "type": "tag",
+    "registry": true,
+    "raw": "@material/textfield",
+    "name": "@material/textfield",
+    "escapedName": "@material%2ftextfield",
+    "scope": "@material",
+    "rawSpec": "",
+    "saveSpec": null,
+    "fetchSpec": "latest"
+  },
+  "_requiredBy": [
+    "#USER",
+    "/"
+  ],
+  "_resolved": "https://registry.npmjs.org/@material/textfield/-/textfield-0.38.1.tgz",
+  "_shasum": "f0dc2d7b534a51845a84f71fbd8199b6cc0b5130",
+  "_spec": "@material/textfield",
+  "_where": "C:\\Users\\jakch\\github\\tool-hub",
+  "bugs": {
+    "url": "https://github.com/material-components/material-components-web/issues"
+  },
+  "bundleDependencies": false,
+  "dependencies": {
+    "@material/animation": "^0.34.0",
+    "@material/base": "^0.35.0",
+    "@material/floating-label": "^0.38.0",
+    "@material/line-ripple": "^0.38.0",
+    "@material/notched-outline": "^0.38.0",
+    "@material/ripple": "^0.38.1",
+    "@material/rtl": "^0.36.0",
+    "@material/theme": "^0.38.0",
+    "@material/typography": "^0.38.0"
+  },
+  "deprecated": false,
+  "description": "The Material Components for the web text field component",
+  "homepage": "https://github.com/material-components/material-components-web#readme",
+  "keywords": [
+    "material components",
+    "material design",
+    "textfield",
+    "text field"
+  ],
+  "license": "Apache-2.0",
+  "main": "index.js",
+  "name": "@material/textfield",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/material-components/material-components-web.git"
+  },
+  "version": "0.38.1"
+}
diff --git a/package-lock.json b/package-lock.json
index d8c97dd..7332675 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -73,6 +73,24 @@
         "@material/theme": "0.35.0"
       }
     },
+    "@material/floating-label": {
+      "version": "0.38.0",
+      "resolved": "https://registry.npmjs.org/@material/floating-label/-/floating-label-0.38.0.tgz",
+      "integrity": "sha512-ga+7ELYrkiRYMHqkLOnCKaQUvGowMYXqML3I7hBhs3eEchTjx42U7bfTSqbfdiNG1F9+cOcSOWTKug2VOkYlkg==",
+      "requires": {
+        "@material/base": "0.35.0",
+        "@material/rtl": "0.36.0",
+        "@material/theme": "0.38.0",
+        "@material/typography": "0.38.0"
+      },
+      "dependencies": {
+        "@material/theme": {
+          "version": "0.38.0",
+          "resolved": "https://registry.npmjs.org/@material/theme/-/theme-0.38.0.tgz",
+          "integrity": "sha512-mP5+qgICPm/0dD3hKa/hMd8AHerkAaLJgEsvBwTXi+N/kpPo9LIrHg40DvUGPs5w6KD9PUuskb3WGBvYcToHvA=="
+        }
+      }
+    },
     "@material/icon-button": {
       "version": "0.37.1",
       "resolved": "https://registry.npmjs.org/@material/icon-button/-/icon-button-0.37.1.tgz",
@@ -88,6 +106,23 @@
       "resolved": "https://registry.npmjs.org/@material/layout-grid/-/layout-grid-0.34.0.tgz",
       "integrity": "sha512-LJ3LHCumfGftl1ihO0LW9JKsnR71nnlvpzhHdUlK6o1GPul+EEUUdOFN1zxI+Ik9iS++1na/Dg8f/1sdQUxj6w=="
     },
+    "@material/line-ripple": {
+      "version": "0.38.0",
+      "resolved": "https://registry.npmjs.org/@material/line-ripple/-/line-ripple-0.38.0.tgz",
+      "integrity": "sha512-HdfU0J1Q3CT2Z/H4aBEKGRTd7K33WhhQkieI4NGGyKSx4uwiRyr61i44Oo+YHK+fVqPjh+aMSjQU3wAfu3vSvA==",
+      "requires": {
+        "@material/animation": "0.34.0",
+        "@material/base": "0.35.0",
+        "@material/theme": "0.38.0"
+      },
+      "dependencies": {
+        "@material/theme": {
+          "version": "0.38.0",
+          "resolved": "https://registry.npmjs.org/@material/theme/-/theme-0.38.0.tgz",
+          "integrity": "sha512-mP5+qgICPm/0dD3hKa/hMd8AHerkAaLJgEsvBwTXi+N/kpPo9LIrHg40DvUGPs5w6KD9PUuskb3WGBvYcToHvA=="
+        }
+      }
+    },
     "@material/list": {
       "version": "0.38.1",
       "resolved": "https://registry.npmjs.org/@material/list/-/list-0.38.1.tgz",
@@ -122,6 +157,23 @@
         }
       }
     },
+    "@material/notched-outline": {
+      "version": "0.38.0",
+      "resolved": "https://registry.npmjs.org/@material/notched-outline/-/notched-outline-0.38.0.tgz",
+      "integrity": "sha512-XDTVXyQ2TR/9Qa66F1UYBSbf5f0IVFJFjiF8TXyIkoqrP6l7Wauj+UvJpinwCPk/6KoZtj29sh6ToGQiHdVIJA==",
+      "requires": {
+        "@material/animation": "0.34.0",
+        "@material/base": "0.35.0",
+        "@material/theme": "0.38.0"
+      },
+      "dependencies": {
+        "@material/theme": {
+          "version": "0.38.0",
+          "resolved": "https://registry.npmjs.org/@material/theme/-/theme-0.38.0.tgz",
+          "integrity": "sha512-mP5+qgICPm/0dD3hKa/hMd8AHerkAaLJgEsvBwTXi+N/kpPo9LIrHg40DvUGPs5w6KD9PUuskb3WGBvYcToHvA=="
+        }
+      }
+    },
     "@material/ripple": {
       "version": "0.37.1",
       "resolved": "https://registry.npmjs.org/@material/ripple/-/ripple-0.37.1.tgz",
@@ -137,6 +189,44 @@
       "resolved": "https://registry.npmjs.org/@material/rtl/-/rtl-0.36.0.tgz",
       "integrity": "sha512-uCMwWGdKG0ooYh1kVINz7vTgSY++9wnvU3kOqjRdfOY+PZHWSa/X/EqRdE9Q1pUFwYlQeU2PXE/Z2dTK/nlziw=="
     },
+    "@material/shape": {
+      "version": "0.35.0",
+      "resolved": "https://registry.npmjs.org/@material/shape/-/shape-0.35.0.tgz",
+      "integrity": "sha512-WMmGLWrqRymMn8gaPybDWRIx7zNurUmaUa/OoxB++HSiLdLZf8hdEffiWLgqc5u97eRpb4IRaIi/jzcPbWxiUw=="
+    },
+    "@material/textfield": {
+      "version": "0.38.1",
+      "resolved": "https://registry.npmjs.org/@material/textfield/-/textfield-0.38.1.tgz",
+      "integrity": "sha512-ymgDVc1W0ToMVnzfjlhATXHgVDST3zqMKfrI7u4eHkXm5v4eaH2SWlIUDBJDUAKtvcHq1BmAhzB3CcWweLw0qw==",
+      "requires": {
+        "@material/animation": "0.34.0",
+        "@material/base": "0.35.0",
+        "@material/floating-label": "0.38.0",
+        "@material/line-ripple": "0.38.0",
+        "@material/notched-outline": "0.38.0",
+        "@material/ripple": "0.38.1",
+        "@material/rtl": "0.36.0",
+        "@material/theme": "0.38.0",
+        "@material/typography": "0.38.0"
+      },
+      "dependencies": {
+        "@material/ripple": {
+          "version": "0.38.1",
+          "resolved": "https://registry.npmjs.org/@material/ripple/-/ripple-0.38.1.tgz",
+          "integrity": "sha512-Y7fmJCEJMfJFkyDCEHkBR66tHqy4JAlG49rk0cI0/xdAFmAKyqUcpJiVwhF+pC8Fad90Wi3G93xu/ig7dvz1bA==",
+          "requires": {
+            "@material/animation": "0.34.0",
+            "@material/base": "0.35.0",
+            "@material/theme": "0.38.0"
+          }
+        },
+        "@material/theme": {
+          "version": "0.38.0",
+          "resolved": "https://registry.npmjs.org/@material/theme/-/theme-0.38.0.tgz",
+          "integrity": "sha512-mP5+qgICPm/0dD3hKa/hMd8AHerkAaLJgEsvBwTXi+N/kpPo9LIrHg40DvUGPs5w6KD9PUuskb3WGBvYcToHvA=="
+        }
+      }
+    },
     "@material/theme": {
       "version": "0.35.0",
       "resolved": "https://registry.npmjs.org/@material/theme/-/theme-0.35.0.tgz",
diff --git a/package.json b/package.json
index de25f40..df6943a 100644
--- a/package.json
+++ b/package.json
@@ -37,7 +37,10 @@
     "@material/icon-button": "^0.37.1",
     "@material/layout-grid": "^0.34.0",
     "@material/list": "^0.38.1",
+    "@material/notched-outline": "^0.38.0",
     "@material/ripple": "^0.37.1",
+    "@material/shape": "^0.35.0",
+    "@material/textfield": "^0.38.1",
     "@material/top-app-bar": "^0.37.1",
     "@material/typography": "^0.38.0"
   }

From c79a17a4143a4ba5e4e32cf13b82a48a2d078fa8 Mon Sep 17 00:00:00 2001
From: jakcharvat <jakcharvat@gmail.com>
Date: Thu, 23 Aug 2018 09:42:52 +0800
Subject: [PATCH 2/2] Fix images not loading

---
 app.scss | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/app.scss b/app.scss
index 4ca5ab1..cd8a5bb 100644
--- a/app.scss
+++ b/app.scss
@@ -220,15 +220,15 @@ body.no-scroll { overflow: hidden; }
 }
 
 .polyconv__media {
-    background-image: url(/imgs/polyConv.png);
+    background-image: url(imgs/polyConv.png);
 }
 
 .centreline__media {
-    background-image: url(/imgs/centreline.png);
+    background-image: url(imgs/centreline.png);
 }
 
 .add__media {
-    background-image: url(/imgs/add.png);
+    background-image: url(imgs/add.png);
 }
 
 .mdc-card__media.hovered {