fix(floating-label): Update transition durations (#2590)

BREAKING CHANGE: Removes the (undocumented) mdc-floating-label-transition function

packages/mdc-floating-label/_variables.scss

@@ -15,3 +15,4 @@
 //
 
 $mdc-floating-label-position-y: 100%;
+$mdc-floating-label-transition-duration: 150ms;

packages/mdc-floating-label/mdc-floating-label.scss

@@ -14,11 +14,11 @@
 // limitations under the License.
 //
 
+@import "@material/animation/variables";
 @import "@material/rtl/mixins";
 @import "@material/theme/variables";
 @import "@material/theme/mixins";
 @import "@material/typography/mixins";
-@import "./functions";
 @import "./mixins";
 @import "./variables";
 
@@ -30,7 +30,9 @@
   bottom: 8px;
   left: 0;
   transform-origin: left top;
-  transition: mdc-floating-label-transition(transform), mdc-floating-label-transition(color);
+  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;
   cursor: text;
 

packages/mdc-floating-label/_functions.scss → packages/mdc-notched-outline/_variables.scss

@@ -1,5 +1,5 @@
 //
-// Copyright 2017 Google Inc. All Rights Reserved.
+// 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.
@@ -14,8 +14,4 @@
 // limitations under the License.
 //
 
-@import "@material/animation/variables";
-
-@function mdc-floating-label-transition($property) {
-  @return #{$property} 180ms $mdc-animation-standard-curve-timing-function;
-}
+$mdc-notched-outline-transition-duration: 150ms;

packages/mdc-notched-outline/mdc-notched-outline.scss

@@ -14,19 +14,21 @@
 // limitations under the License.
 //
 
+@import "@material/animation/variables";
 @import "@material/ripple/mixins";
 @import "@material/ripple/variables";
 @import "@material/textfield/functions";
 @import "@material/theme/mixins";
 @import "./mixins";
+@import "./variables";
 
 .mdc-notched-outline {
   position: absolute;
   top: 0;
   left: 0;
   width: calc(100% - 1px);
   height: calc(100% - 2px);
-  transition: mdc-text-field-transition(opacity);
+  transition: opacity $mdc-notched-outline-transition-duration $mdc-animation-standard-curve-timing-function;
   opacity: 0;
   overflow: hidden;
 
@@ -45,19 +47,18 @@
   left: 0;
   width: calc(100% - 4px);
   height: calc(100% - 4px);
-  transition: opacity 100ms ease;
+  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;
-
-  // TODO(mattgoo): remove this text-field dep from notched-outline
   transition:
-    mdc-text-field-transition(stroke),
-    mdc-text-field-transition(stroke-width),
-    mdc-text-field-transition(opacity);
+    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;
 }
 

packages/mdc-textfield/_mixins.scss

@@ -267,7 +267,6 @@
 
     position: absolute;
     bottom: 20px;
-    transition: transform 260ms ease;
   }
 
   .mdc-text-field__icon {