@material/textfield - npm Package Compare versions

Comparing version 0.4.1 to 0.5.0

constants.js

@@ -21,2 +21,5 @@ /**
   LABEL_SELECTOR: '.mdc-textfield__label',
+  ICON_SELECTOR: '.mdc-textfield__icon',
+  ICON_EVENT: 'MDCTextfield:icon',
+  BOTTOM_LINE_SELECTOR: '.mdc-textfield__bottom-line',
 };
@@ -33,3 +36,7 @@
   LABEL_FLOAT_ABOVE: 'mdc-textfield__label--float-above',
+  LABEL_SHAKE: 'mdc-textfield__label--shake',
   BOX: 'mdc-textfield--box',
+  TEXT_FIELD_ICON: 'mdc-textfield__icon',
+  TEXTAREA: 'mdc-textfield--textarea',
+  BOTTOM_LINE_ACTIVE: 'mdc-textfield__bottom-line--active',
 };

dist/mdc.textfield.min.js

@@ -6,2 +6,34 @@ /*!
 */
-!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 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="/assets/",e(e.s=94)}({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}}(),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},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 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},2: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:"registerInteractionHandler",value:function(t,e){}},{key:"deregisterInteractionHandler",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(){}}])}()},22:function(t,e,n){"use strict";n.d(e,"b",function(){return i}),n.d(e,"a",function(){return a});var i={ARIA_HIDDEN:"aria-hidden",ROLE:"role",INPUT_SELECTOR:".mdc-textfield__input",LABEL_SELECTOR:".mdc-textfield__label"},a={ROOT:"mdc-textfield",UPGRADED:"mdc-textfield--upgraded",DISABLED:"mdc-textfield--disabled",FOCUSED:"mdc-textfield--focused",INVALID:"mdc-textfield--invalid",HELPTEXT_PERSISTENT:"mdc-textfield-helptext--persistent",HELPTEXT_VALIDATION_MSG:"mdc-textfield-helptext--validation-msg",LABEL_FLOAT_ABOVE:"mdc-textfield__label--float-above",BOX:"mdc-textfield--box"}},3: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];if("boolean"==typeof u&&!e)return u;if(t.CSS&&"function"==typeof t.CSS.supports){var n=t.CSS.supports("--css-vars","yes"),a=t.CSS.supports("(--css-vars: yes)")&&t.CSS.supports("color","#00000000");return u=!(!n&&!a||i(t))}}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}),e.supportsCssVariables=a,e.applyPassive=r,e.getMatchesProperty=o,e.getNormalizedEventCoords=s;var u=void 0,c=void 0},4:function(t,e,n){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var i=n(0),a=n(1);n.d(e,"MDCFoundation",function(){return i.a}),n.d(e,"MDCComponent",function(){return a.a})},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 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 l});var o=n(1),s=(n(2),n(6)),u=n(3);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}}(),l=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:"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){var e=s.a.cssClasses.UNBOUNDED;this.unbounded_=Boolean(t),this.unbounded_?this.root_.classList.add(e):this.root_.classList.remove(e)}}],[{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)},registerInteractionHandler:function(e,n){return t.root_.addEventListener(e,n,u.applyPassive())},deregisterInteractionHandler:function(e,n){return t.root_.removeEventListener(e,n,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),d=function t(){i(this,t)};d.prototype.root_,d.prototype.unbounded,d.prototype.disabled},6: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(2),n(7)),u=n(3),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}}(),d={mouseup:"mousedown",pointerup:"pointerdown",touchend:"touchstart",keyup:"keydown",blur:"focus"},f=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.xfDuration_=0,n.initialSize_=0,n.maxRadius_=0,n.listenerInfos_=[{activate:"touchstart",deactivate:"touchend"},{activate:"pointerdown",deactivate:"pointerup"},{activate:"mousedown",deactivate:"mouseup"},{activate:"keydown",deactivate:"keyup"},{focus:"focus",blur:"blur"}],n.listeners_={activate:function(t){return n.activate_(t)},deactivate:function(t){return n.deactivate_(t)},focus:function(){return requestAnimationFrame(function(){return n.adapter_.addClass(e.cssClasses.BG_FOCUSED)})},blur:function(){return requestAnimationFrame(function(){return n.adapter_.removeClass(e.cssClasses.BG_FOCUSED)})}},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}return r(e,t),l(e,[{key:"isSupported_",get:function(){return this.adapter_.browserSupportsCssVars()}}],[{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(){},registerInteractionHandler:function(){},deregisterInteractionHandler:function(){},registerResizeHandler:function(){},deregisterResizeHandler:function(){},updateCssVariable:function(){},computeBoundingRect:function(){},getWindowPageOffset:function(){}}}}]),l(e,[{key:"defaultActivationState_",value:function(){return{isActivated:!1,hasDeactivationUXRun:!1,wasActivatedByPointer:!1,wasElementMadeActive:!1,activationStartTime:0,activationEvent:null,isProgrammatic:!1}}},{key:"init",value:function(){var t=this;if(this.isSupported_){this.addEventListeners_();var n=e.cssClasses,i=n.ROOT,a=n.UNBOUNDED;requestAnimationFrame(function(){t.adapter_.addClass(i),t.adapter_.isUnbounded()&&t.adapter_.addClass(a),t.layoutInternal_()})}}},{key:"addEventListeners_",value:function(){var t=this;this.listenerInfos_.forEach(function(e){Object.keys(e).forEach(function(n){t.adapter_.registerInteractionHandler(e[n],t.listeners_[n])})}),this.adapter_.registerResizeHandler(this.resizeHandler_)}},{key:"activate_",value:function(t){var e=this;if(!this.adapter_.isSurfaceDisabled()){var n=this.activationState_;n.isActivated||(n.isActivated=!0,n.isProgrammatic=null===t,n.activationEvent=t,n.wasActivatedByPointer=!n.isProgrammatic&&("mousedown"===t.type||"touchstart"===t.type||"pointerdown"===t.type),n.activationStartTime=Date.now(),requestAnimationFrame(function(){n.wasElementMadeActive=!t||"keydown"!==t.type||e.adapter_.isSurfaceActive(),n.wasElementMadeActive?e.animateActivation_():e.activationState_=e.defaultActivationState_()}))}}},{key:"activate",value:function(){this.activate_(null)}},{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.BG_ACTIVE_FILL,s=r.FG_DEACTIVATION,u=r.FG_ACTIVATION,c=e.numbers.DEACTIVATION_TIMEOUT_MS,l="",d="";if(!this.adapter_.isUnbounded()){var f=this.getFgTranslationCoordinates_(),p=f.startPoint,v=f.endPoint;l=p.x+"px, "+p.y+"px",d=v.x+"px, "+v.y+"px"}this.adapter_.updateCssVariable(i,l),this.adapter_.updateCssVariable(a,d),clearTimeout(this.activationTimer_),clearTimeout(this.fgDeactivationRemovalTimer_),this.rmBoundedActivationClasses_(),this.adapter_.removeClass(s),this.adapter_.computeBoundingRect(),this.adapter_.addClass(o),this.adapter_.addClass(u),this.activationTimer_=setTimeout(function(){return t.activationTimerCallback_()},c)}},{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,n=t.BG_ACTIVE_FILL,i=t.FG_ACTIVATION;this.adapter_.removeClass(n),this.adapter_.removeClass(i),this.activationAnimationHasEnded_=!1,this.adapter_.computeBoundingRect()}},{key:"deactivate_",value:function(t){var e=this,n=this.activationState_;if(n.isActivated){if(n.isProgrammatic){var i=c({},n);return requestAnimationFrame(function(){return e.animateDeactivation_(null,i)}),void(this.activationState_=this.defaultActivationState_())}var a=d[t.type],r=n.activationEvent.type,o=a===r,s=o;n.wasActivatedByPointer&&(s="mouseup"===t.type);var u=c({},n);requestAnimationFrame(function(){o&&(e.activationState_.hasDeactivationUXRun=!0,e.animateDeactivation_(t,u)),s&&(e.activationState_=e.defaultActivationState_())})}}},{key:"deactivate",value:function(){this.deactivate_(null)}},{key:"animateDeactivation_",value:function(t,n){var i=n.wasActivatedByPointer,a=n.wasElementMadeActive,r=e.cssClasses.BG_FOCUSED;(i||a)&&(this.adapter_.removeClass(r),this.runDeactivationUXLogicIfReady_())}},{key:"destroy",value:function(){var t=this;if(this.isSupported_){this.removeEventListeners_();var n=e.cssClasses,i=n.ROOT,a=n.UNBOUNDED;requestAnimationFrame(function(){t.adapter_.removeClass(i),t.adapter_.removeClass(a),t.removeCssVars_()})}}},{key:"removeEventListeners_",value:function(){var t=this;this.listenerInfos_.forEach(function(e){Object.keys(e).forEach(function(n){t.adapter_.deregisterInteractionHandler(e[n],t.listeners_[n])})}),this.adapter_.deregisterResizeHandler(this.resizeHandler_)}},{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:"layout",value:function(){var t=this;this.layoutFrame_&&cancelAnimationFrame(this.layoutFrame_),this.layoutFrame_=requestAnimationFrame(function(){t.layoutInternal_(),t.layoutFrame_=0})}},{key:"layoutInternal_",value:function(){this.frame_=this.adapter_.computeBoundingRect();var t=Math.max(this.frame_.height,this.frame_.width),n=Math.sqrt(Math.pow(this.frame_.width,2)+Math.pow(this.frame_.height,2));this.initialSize_=t*e.numbers.INITIAL_ORIGIN_SCALE,this.maxRadius_=n+e.numbers.PADDING,this.fgScale_=this.maxRadius_/this.initialSize_,this.xfDuration_=1e3*Math.sqrt(this.maxRadius_/1024),this.updateLayoutCssVars_()}},{key:"updateLayoutCssVars_",value:function(){var t=e.strings,n=t.VAR_SURFACE_WIDTH,i=t.VAR_SURFACE_HEIGHT,a=t.VAR_FG_SIZE,r=t.VAR_LEFT,o=t.VAR_TOP,s=t.VAR_FG_SCALE;this.adapter_.updateCssVariable(n,this.frame_.width+"px"),this.adapter_.updateCssVariable(i,this.frame_.height+"px"),this.adapter_.updateCssVariable(a,this.initialSize_+"px"),this.adapter_.updateCssVariable(s,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(r,this.unboundedCoords_.left+"px"),this.adapter_.updateCssVariable(o,this.unboundedCoords_.top+"px"))}}]),e}(o.a);e.a=f},7: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});var i={ROOT:"mdc-ripple-upgraded",UNBOUNDED:"mdc-ripple-upgraded--unbounded",BG_FOCUSED:"mdc-ripple-upgraded--background-focused",BG_ACTIVE_FILL:"mdc-ripple-upgraded--background-active-fill",FG_ACTIVATION:"mdc-ripple-upgraded--foreground-activation",FG_DEACTIVATION:"mdc-ripple-upgraded--foreground-deactivation"},a={VAR_SURFACE_WIDTH:"--mdc-ripple-surface-width",VAR_SURFACE_HEIGHT:"--mdc-ripple-surface-height",VAR_FG_SIZE:"--mdc-ripple-fg-size",VAR_LEFT:"--mdc-ripple-left",VAR_TOP:"--mdc-ripple-top",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:300,FG_DEACTIVATION_MS:83}},94:function(t,e,n){t.exports=n(95)},95: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,"MDCTextfield",function(){return p});var o=n(4),s=n(5),u=n(22),c=n(96);n.d(e,"MDCTextfieldFoundation",function(){return c.a});var l=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}}(),f=function t(e,n,i){null===e&&(e=Function.prototype);var a=Object.getOwnPropertyDescriptor(e,n);if(void 0===a){var r=Object.getPrototypeOf(e);return null===r?void 0:t(r,n,i)}if("value"in a)return a.value;var o=a.get;if(void 0!==o)return o.call(i)},p=function(t){function e(){return i(this,e),a(this,(e.__proto__||Object.getPrototypeOf(e)).apply(this,arguments))}return r(e,t),d(e,[{key:"initialize",value:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:function(t){return new s.MDCRipple(t)};this.input_=this.root_.querySelector(u.b.INPUT_SELECTOR),this.label_=this.root_.querySelector(u.b.LABEL_SELECTOR),this.helptextElement=null,this.ripple=null,this.input_.hasAttribute("aria-controls")&&(this.helptextElement=document.getElementById(this.input_.getAttribute("aria-controls"))),this.root_.classList.contains(u.a.BOX)&&(this.ripple=t(this.root_))}},{key:"destroy",value:function(){this.ripple&&this.ripple.destroy(),f(e.prototype.__proto__||Object.getPrototypeOf(e.prototype),"destroy",this).call(this)}},{key:"initialSyncWithDom",value:function(){this.disabled=this.input_.disabled}},{key:"getDefaultFoundation",value:function(){var t=this;return new c.a(l({addClass:function(e){return t.root_.classList.add(e)},removeClass:function(e){return t.root_.classList.remove(e)},addClassToLabel:function(e){var n=t.label_;n&&n.classList.add(e)},removeClassFromLabel:function(e){var n=t.label_;n&&n.classList.remove(e)}},this.getInputAdapterMethods_(),this.getHelptextAdapterMethods_()))}},{key:"getInputAdapterMethods_",value:function(){var t=this;return{registerInputFocusHandler:function(e){return t.input_.addEventListener("focus",e)},registerInputBlurHandler:function(e){return t.input_.addEventListener("blur",e)},registerInputInputHandler:function(e){return t.input_.addEventListener("input",e)},registerInputKeydownHandler:function(e){return t.input_.addEventListener("keydown",e)},deregisterInputFocusHandler:function(e){return t.input_.removeEventListener("focus",e)},deregisterInputBlurHandler:function(e){return t.input_.removeEventListener("blur",e)},deregisterInputInputHandler:function(e){return t.input_.removeEventListener("input",e)},deregisterInputKeydownHandler:function(e){return t.input_.removeEventListener("keydown",e)},getNativeInput:function(){return t.input_}}}},{key:"getHelptextAdapterMethods_",value:function(){var t=this;return{addClassToHelptext:function(e){t.helptextElement&&t.helptextElement.classList.add(e)},removeClassFromHelptext:function(e){t.helptextElement&&t.helptextElement.classList.remove(e)},helptextHasClass:function(e){return!!t.helptextElement&&t.helptextElement.classList.contains(e)},setHelptextAttr:function(e,n){t.helptextElement&&t.helptextElement.setAttribute(e,n)},removeHelptextAttr:function(e){t.helptextElement&&t.helptextElement.removeAttribute(e)}}}},{key:"disabled",get:function(){return this.foundation_.isDisabled()},set:function(t){this.foundation_.setDisabled(t)}},{key:"valid",set:function(t){this.foundation_.setValid(t)}}],[{key:"attachTo",value:function(t){return new e(t)}}]),e}(o.MDCComponent)},96: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(4),s=n(22),u=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=a(this,(e.__proto__||Object.getPrototypeOf(e)).call(this,u(e.defaultAdapter,t)));return n.receivedUserInput_=!1,n.inputFocusHandler_=function(){return n.activateFocus_()},n.inputBlurHandler_=function(){return n.deactivateFocus_()},n.inputInputHandler_=function(){return n.autoCompleteFocus_()},n.inputKeydownHandler_=function(){return n.receivedUserInput_=!0},n.useCustomValidityChecking_=!1,n}return r(e,t),c(e,null,[{key:"cssClasses",get:function(){return s.a}},{key:"strings",get:function(){return s.b}},{key:"defaultAdapter",get:function(){return{addClass:function(){},removeClass:function(){},addClassToLabel:function(){},removeClassFromLabel:function(){},addClassToHelptext:function(){},removeClassFromHelptext:function(){},helptextHasClass:function(){return!1},registerInputFocusHandler:function(){},deregisterInputFocusHandler:function(){},registerInputBlurHandler:function(){},deregisterInputBlurHandler:function(){},registerInputInputHandler:function(){},deregisterInputInputHandler:function(){},registerInputKeydownHandler:function(){},deregisterInputKeydownHandler:function(){},setHelptextAttr:function(){},removeHelptextAttr:function(){},getNativeInput:function(){return{}}}}}]),c(e,[{key:"init",value:function(){this.adapter_.addClass(e.cssClasses.UPGRADED),this.adapter_.registerInputFocusHandler(this.inputFocusHandler_),this.adapter_.registerInputBlurHandler(this.inputBlurHandler_),this.adapter_.registerInputInputHandler(this.inputInputHandler_),this.adapter_.registerInputKeydownHandler(this.inputKeydownHandler_),this.getNativeInput_().value&&this.adapter_.addClassToLabel(e.cssClasses.LABEL_FLOAT_ABOVE)}},{key:"destroy",value:function(){this.adapter_.removeClass(e.cssClasses.UPGRADED),this.adapter_.deregisterInputFocusHandler(this.inputFocusHandler_),this.adapter_.deregisterInputBlurHandler(this.inputBlurHandler_),this.adapter_.deregisterInputInputHandler(this.inputInputHandler_),this.adapter_.deregisterInputKeydownHandler(this.inputKeydownHandler_)}},{key:"activateFocus_",value:function(){var t=e.cssClasses,n=t.FOCUSED,i=t.LABEL_FLOAT_ABOVE;this.adapter_.addClass(n),this.adapter_.addClassToLabel(i),this.showHelptext_()}},{key:"autoCompleteFocus_",value:function(){this.receivedUserInput_||this.activateFocus_()}},{key:"showHelptext_",value:function(){var t=e.strings.ARIA_HIDDEN;this.adapter_.removeHelptextAttr(t)}},{key:"deactivateFocus_",value:function(){var t=e.cssClasses,n=t.FOCUSED,i=t.LABEL_FLOAT_ABOVE,a=this.getNativeInput_();this.adapter_.removeClass(n),a.value||this.isBadInput_()||(this.adapter_.removeClassFromLabel(i),this.receivedUserInput_=!1),this.useCustomValidityChecking_||this.changeValidity_(a.checkValidity())}},{key:"changeValidity_",value:function(t){var n=e.cssClasses.INVALID;t?this.adapter_.removeClass(n):this.adapter_.addClass(n),this.updateHelptext_(t)}},{key:"updateHelptext_",value:function(t){var n=e.cssClasses,i=n.HELPTEXT_PERSISTENT,a=n.HELPTEXT_VALIDATION_MSG,r=e.strings.ROLE,o=this.adapter_.helptextHasClass(i),s=this.adapter_.helptextHasClass(a),u=s&&!t;u?this.adapter_.setHelptextAttr(r,"alert"):this.adapter_.removeHelptextAttr(r),o||u||this.hideHelptext_()}},{key:"hideHelptext_",value:function(){var t=e.strings.ARIA_HIDDEN;this.adapter_.setHelptextAttr(t,"true")}},{key:"isBadInput_",value:function(){var t=this.getNativeInput_();return t.validity?t.validity.badInput:t.badInput}},{key:"isDisabled",value:function(){return this.getNativeInput_().disabled}},{key:"setDisabled",value:function(t){var n=e.cssClasses.DISABLED;this.getNativeInput_().disabled=t,t?this.adapter_.addClass(n):this.adapter_.removeClass(n)}},{key:"getNativeInput_",value:function(){return this.adapter_.getNativeInput()||{checkValidity:function(){return!0},value:"",disabled:!1,badInput:!1}}},{key:"setValid",value:function(t){this.useCustomValidityChecking_=!0,this.changeValidity_(t)}}]),e}(o.MDCFoundation);e.a=l}})});
+!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 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="/assets/",e(e.s=94)}({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}}(),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},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 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},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),a=null!==i&&"solid"===i.borderTopStyle;return n.remove(),a}function a(t){var e=arguments.length>1&&void 0!==arguments[1]&&arguments[1];if("boolean"==typeof u&&!e)return u;if(t.CSS&&"function"==typeof t.CSS.supports){var n=t.CSS.supports("--css-vars","yes"),a=t.CSS.supports("(--css-vars: yes)")&&t.CSS.supports("color","#00000000");return u=!(!n&&!a||i(t))}}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},22:function(t,e,n){"use strict";n.d(e,"b",function(){return i}),n.d(e,"a",function(){return a});var i={ARIA_HIDDEN:"aria-hidden",ROLE:"role",INPUT_SELECTOR:".mdc-textfield__input",LABEL_SELECTOR:".mdc-textfield__label",ICON_SELECTOR:".mdc-textfield__icon",ICON_EVENT:"MDCTextfield:icon",BOTTOM_LINE_SELECTOR:".mdc-textfield__bottom-line"},a={ROOT:"mdc-textfield",UPGRADED:"mdc-textfield--upgraded",DISABLED:"mdc-textfield--disabled",FOCUSED:"mdc-textfield--focused",INVALID:"mdc-textfield--invalid",HELPTEXT_PERSISTENT:"mdc-textfield-helptext--persistent",HELPTEXT_VALIDATION_MSG:"mdc-textfield-helptext--validation-msg",LABEL_FLOAT_ABOVE:"mdc-textfield__label--float-above",LABEL_SHAKE:"mdc-textfield__label--shake",BOX:"mdc-textfield--box",TEXT_FIELD_ICON:"mdc-textfield__icon",TEXTAREA:"mdc-textfield--textarea",BOTTOM_LINE_ACTIVE:"mdc-textfield__bottom-line--active"}},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 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:"registerInteractionHandler",value:function(t,e){}},{key:"deregisterInteractionHandler",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";Object.defineProperty(e,"__esModule",{value:!0});var i=n(0),a=n(1);n.d(e,"MDCFoundation",function(){return i.a}),n.d(e,"MDCComponent",function(){return a.a})},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 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 l});var o=n(1),s=(n(3),n(6)),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}}(),l=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:"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){var e=s.a.cssClasses.UNBOUNDED;this.unbounded_=Boolean(t),this.unbounded_?this.root_.classList.add(e):this.root_.classList.remove(e)}}],[{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)},registerInteractionHandler:function(e,n){return t.root_.addEventListener(e,n,u.applyPassive())},deregisterInteractionHandler:function(e,n){return t.root_.removeEventListener(e,n,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),d=function t(){i(this,t)};d.prototype.root_,d.prototype.unbounded,d.prototype.disabled},6: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(7)),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},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}}(),d={mouseup:"mousedown",pointerup:"pointerdown",touchend:"touchstart",keyup:"keydown",blur:"focus"},f=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.xfDuration_=0,n.initialSize_=0,n.maxRadius_=0,n.listenerInfos_=[{activate:"touchstart",deactivate:"touchend"},{activate:"pointerdown",deactivate:"pointerup"},{activate:"mousedown",deactivate:"mouseup"},{activate:"keydown",deactivate:"keyup"},{focus:"focus",blur:"blur"}],n.listeners_={activate:function(t){return n.activate_(t)},deactivate:function(t){return n.deactivate_(t)},focus:function(){return requestAnimationFrame(function(){return n.adapter_.addClass(e.cssClasses.BG_FOCUSED)})},blur:function(){return requestAnimationFrame(function(){return n.adapter_.removeClass(e.cssClasses.BG_FOCUSED)})}},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}return r(e,t),l(e,[{key:"isSupported_",get:function(){return this.adapter_.browserSupportsCssVars()}}],[{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(){},registerInteractionHandler:function(){},deregisterInteractionHandler:function(){},registerResizeHandler:function(){},deregisterResizeHandler:function(){},updateCssVariable:function(){},computeBoundingRect:function(){},getWindowPageOffset:function(){}}}}]),l(e,[{key:"defaultActivationState_",value:function(){return{isActivated:!1,hasDeactivationUXRun:!1,wasActivatedByPointer:!1,wasElementMadeActive:!1,activationStartTime:0,activationEvent:null,isProgrammatic:!1}}},{key:"init",value:function(){var t=this;if(this.isSupported_){this.addEventListeners_();var n=e.cssClasses,i=n.ROOT,a=n.UNBOUNDED;requestAnimationFrame(function(){t.adapter_.addClass(i),t.adapter_.isUnbounded()&&t.adapter_.addClass(a),t.layoutInternal_()})}}},{key:"addEventListeners_",value:function(){var t=this;this.listenerInfos_.forEach(function(e){Object.keys(e).forEach(function(n){t.adapter_.registerInteractionHandler(e[n],t.listeners_[n])})}),this.adapter_.registerResizeHandler(this.resizeHandler_)}},{key:"activate_",value:function(t){var e=this;if(!this.adapter_.isSurfaceDisabled()){var n=this.activationState_;n.isActivated||(n.isActivated=!0,n.isProgrammatic=null===t,n.activationEvent=t,n.wasActivatedByPointer=!n.isProgrammatic&&("mousedown"===t.type||"touchstart"===t.type||"pointerdown"===t.type),n.activationStartTime=Date.now(),requestAnimationFrame(function(){n.wasElementMadeActive=!t||"keydown"!==t.type||e.adapter_.isSurfaceActive(),n.wasElementMadeActive?e.animateActivation_():e.activationState_=e.defaultActivationState_()}))}}},{key:"activate",value:function(){this.activate_(null)}},{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.BG_ACTIVE_FILL,s=r.FG_DEACTIVATION,u=r.FG_ACTIVATION,c=e.numbers.DEACTIVATION_TIMEOUT_MS,l="",d="";if(!this.adapter_.isUnbounded()){var f=this.getFgTranslationCoordinates_(),p=f.startPoint,_=f.endPoint;l=p.x+"px, "+p.y+"px",d=_.x+"px, "+_.y+"px"}this.adapter_.updateCssVariable(i,l),this.adapter_.updateCssVariable(a,d),clearTimeout(this.activationTimer_),clearTimeout(this.fgDeactivationRemovalTimer_),this.rmBoundedActivationClasses_(),this.adapter_.removeClass(s),this.adapter_.computeBoundingRect(),this.adapter_.addClass(o),this.adapter_.addClass(u),this.activationTimer_=setTimeout(function(){return t.activationTimerCallback_()},c)}},{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,n=t.BG_ACTIVE_FILL,i=t.FG_ACTIVATION;this.adapter_.removeClass(n),this.adapter_.removeClass(i),this.activationAnimationHasEnded_=!1,this.adapter_.computeBoundingRect()}},{key:"deactivate_",value:function(t){var e=this,n=this.activationState_;if(n.isActivated){if(n.isProgrammatic){var i=c({},n);return requestAnimationFrame(function(){return e.animateDeactivation_(null,i)}),void(this.activationState_=this.defaultActivationState_())}var a=d[t.type],r=n.activationEvent.type,o=a===r,s=o;n.wasActivatedByPointer&&(s="mouseup"===t.type);var u=c({},n);requestAnimationFrame(function(){o&&(e.activationState_.hasDeactivationUXRun=!0,e.animateDeactivation_(t,u)),s&&(e.activationState_=e.defaultActivationState_())})}}},{key:"deactivate",value:function(){this.deactivate_(null)}},{key:"animateDeactivation_",value:function(t,n){var i=n.wasActivatedByPointer,a=n.wasElementMadeActive,r=e.cssClasses.BG_FOCUSED;(i||a)&&(this.adapter_.removeClass(r),this.runDeactivationUXLogicIfReady_())}},{key:"destroy",value:function(){var t=this;if(this.isSupported_){this.removeEventListeners_();var n=e.cssClasses,i=n.ROOT,a=n.UNBOUNDED;requestAnimationFrame(function(){t.adapter_.removeClass(i),t.adapter_.removeClass(a),t.removeCssVars_()})}}},{key:"removeEventListeners_",value:function(){var t=this;this.listenerInfos_.forEach(function(e){Object.keys(e).forEach(function(n){t.adapter_.deregisterInteractionHandler(e[n],t.listeners_[n])})}),this.adapter_.deregisterResizeHandler(this.resizeHandler_)}},{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:"layout",value:function(){var t=this;this.layoutFrame_&&cancelAnimationFrame(this.layoutFrame_),this.layoutFrame_=requestAnimationFrame(function(){t.layoutInternal_(),t.layoutFrame_=0})}},{key:"layoutInternal_",value:function(){this.frame_=this.adapter_.computeBoundingRect();var t=Math.max(this.frame_.height,this.frame_.width),n=Math.sqrt(Math.pow(this.frame_.width,2)+Math.pow(this.frame_.height,2));this.initialSize_=t*e.numbers.INITIAL_ORIGIN_SCALE,this.maxRadius_=n+e.numbers.PADDING,this.fgScale_=this.maxRadius_/this.initialSize_,this.xfDuration_=1e3*Math.sqrt(this.maxRadius_/1024),this.updateLayoutCssVars_()}},{key:"updateLayoutCssVars_",value:function(){var t=e.strings,n=t.VAR_SURFACE_WIDTH,i=t.VAR_SURFACE_HEIGHT,a=t.VAR_FG_SIZE,r=t.VAR_LEFT,o=t.VAR_TOP,s=t.VAR_FG_SCALE;this.adapter_.updateCssVariable(n,this.frame_.width+"px"),this.adapter_.updateCssVariable(i,this.frame_.height+"px"),this.adapter_.updateCssVariable(a,this.initialSize_+"px"),this.adapter_.updateCssVariable(s,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(r,this.unboundedCoords_.left+"px"),this.adapter_.updateCssVariable(o,this.unboundedCoords_.top+"px"))}}]),e}(o.a);e.a=f},7: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",BG_ACTIVE_FILL:"mdc-ripple-upgraded--background-active-fill",FG_ACTIVATION:"mdc-ripple-upgraded--foreground-activation",FG_DEACTIVATION:"mdc-ripple-upgraded--foreground-deactivation"},a={VAR_SURFACE_WIDTH:"--mdc-ripple-surface-width",VAR_SURFACE_HEIGHT:"--mdc-ripple-surface-height",VAR_FG_SIZE:"--mdc-ripple-fg-size",VAR_LEFT:"--mdc-ripple-left",VAR_TOP:"--mdc-ripple-top",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:300,FG_DEACTIVATION_MS:83}},94:function(t,e,n){t.exports=n(95)},95: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,"MDCTextfield",function(){return p});var o=n(4),s=n(5),u=n(22),c=n(96);n.d(e,"MDCTextfieldFoundation",function(){return c.a});var l=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}}(),f=function t(e,n,i){null===e&&(e=Function.prototype);var a=Object.getOwnPropertyDescriptor(e,n);if(void 0===a){var r=Object.getPrototypeOf(e);return null===r?void 0:t(r,n,i)}if("value"in a)return a.value;var o=a.get;if(void 0!==o)return o.call(i)},p=function(t){function e(){return i(this,e),a(this,(e.__proto__||Object.getPrototypeOf(e)).apply(this,arguments))}return r(e,t),d(e,[{key:"initialize",value:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:function(t){return new s.MDCRipple(t)};this.input_=this.root_.querySelector(u.b.INPUT_SELECTOR),this.label_=this.root_.querySelector(u.b.LABEL_SELECTOR),this.helptextElement=null,this.ripple=null,this.input_.hasAttribute("aria-controls")&&(this.helptextElement=document.getElementById(this.input_.getAttribute("aria-controls"))),this.root_.classList.contains(u.a.BOX)&&(this.ripple=t(this.root_)),this.root_.classList.contains(u.a.TEXTAREA)||(this.bottomLine_=this.root_.querySelector(u.b.BOTTOM_LINE_SELECTOR)),this.root_.classList.contains(u.a.TEXT_FIELD_ICON)||(this.icon_=this.root_.querySelector(u.b.ICON_SELECTOR))}},{key:"destroy",value:function(){this.ripple&&this.ripple.destroy(),f(e.prototype.__proto__||Object.getPrototypeOf(e.prototype),"destroy",this).call(this)}},{key:"initialSyncWithDom",value:function(){this.disabled=this.input_.disabled}},{key:"getDefaultFoundation",value:function(){var t=this;return new c.a(l({addClass:function(e){return t.root_.classList.add(e)},removeClass:function(e){return t.root_.classList.remove(e)},addClassToLabel:function(e){var n=t.label_;n&&n.classList.add(e)},removeClassFromLabel:function(e){var n=t.label_;n&&n.classList.remove(e)},eventTargetHasClass:function(t,e){return t.classList.contains(e)},registerTextFieldInteractionHandler:function(e,n){return t.root_.addEventListener(e,n)},deregisterTextFieldInteractionHandler:function(e,n){return t.root_.removeEventListener(e,n)},notifyIconAction:function(){return t.emit(c.a.strings.ICON_EVENT)}},this.getInputAdapterMethods_(),this.getHelptextAdapterMethods_(),this.getBottomLineAdapterMethods_(),this.getIconAdapterMethods_()))}},{key:"getIconAdapterMethods_",value:function(){var t=this;return{setIconAttr:function(e,n){t.icon_&&t.icon_.setAttribute(e,n)}}}},{key:"getBottomLineAdapterMethods_",value:function(){var t=this;return{addClassToBottomLine:function(e){t.bottomLine_&&t.bottomLine_.classList.add(e)},removeClassFromBottomLine:function(e){t.bottomLine_&&t.bottomLine_.classList.remove(e)},setBottomLineAttr:function(e,n){t.bottomLine_&&t.bottomLine_.setAttribute(e,n)},registerTransitionEndHandler:function(e){t.bottomLine_&&t.bottomLine_.addEventListener("transitionend",e)},deregisterTransitionEndHandler:function(e){t.bottomLine_&&t.bottomLine_.removeEventListener("transitionend",e)}}}},{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:"getHelptextAdapterMethods_",value:function(){var t=this;return{addClassToHelptext:function(e){t.helptextElement&&t.helptextElement.classList.add(e)},removeClassFromHelptext:function(e){t.helptextElement&&t.helptextElement.classList.remove(e)},helptextHasClass:function(e){return!!t.helptextElement&&t.helptextElement.classList.contains(e)},setHelptextAttr:function(e,n){t.helptextElement&&t.helptextElement.setAttribute(e,n)},removeHelptextAttr:function(e){t.helptextElement&&t.helptextElement.removeAttribute(e)}}}},{key:"disabled",get:function(){return this.foundation_.isDisabled()},set:function(t){this.foundation_.setDisabled(t)}},{key:"valid",set:function(t){this.foundation_.setValid(t)}}],[{key:"attachTo",value:function(t){return new e(t)}}]),e}(o.MDCComponent)},96: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(4),s=n(22),u=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=a(this,(e.__proto__||Object.getPrototypeOf(e)).call(this,u(e.defaultAdapter,t)));return n.isFocused_=!1,n.receivedUserInput_=!1,n.useCustomValidityChecking_=!1,n.inputFocusHandler_=function(){return n.activateFocus_()},n.inputBlurHandler_=function(){return n.deactivateFocus_()},n.inputInputHandler_=function(){return n.autoCompleteFocus_()},n.setPointerXOffset_=function(t){return n.setBottomLineTransformOrigin_(t)},n.textFieldInteractionHandler_=function(t){return n.handleTextFieldInteraction_(t)},n.transitionEndHandler_=function(t){return n.transitionEnd_(t)},n}return r(e,t),c(e,null,[{key:"cssClasses",get:function(){return s.a}},{key:"strings",get:function(){return s.b}},{key:"defaultAdapter",get:function(){return{addClass:function(){},removeClass:function(){},addClassToLabel:function(){},removeClassFromLabel:function(){},setIconAttr:function(){},eventTargetHasClass:function(){},registerTextFieldInteractionHandler:function(){},deregisterTextFieldInteractionHandler:function(){},notifyIconAction:function(){},addClassToBottomLine:function(){},removeClassFromBottomLine:function(){},addClassToHelptext:function(){},removeClassFromHelptext:function(){},helptextHasClass:function(){return!1},registerInputInteractionHandler:function(){},deregisterInputInteractionHandler:function(){},registerTransitionEndHandler:function(){},deregisterTransitionEndHandler:function(){},setBottomLineAttr:function(){},setHelptextAttr:function(){},removeHelptextAttr:function(){},getNativeInput:function(){}}}}]),c(e,[{key:"init",value:function(){var t=this;this.adapter_.addClass(e.cssClasses.UPGRADED),this.getNativeInput_().value&&this.adapter_.addClassToLabel(e.cssClasses.LABEL_FLOAT_ABOVE),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.adapter_.registerTransitionEndHandler(this.transitionEndHandler_)}},{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_.deregisterTransitionEndHandler(this.transitionEndHandler_)}},{key:"handleTextFieldInteraction_",value:function(t){if(!this.adapter_.getNativeInput().disabled){this.receivedUserInput_=!0;var n=t.target,i=t.type,a=e.cssClasses.TEXT_FIELD_ICON,r=this.adapter_.eventTargetHasClass(n,a),o="click"===i||"Enter"===t.key||13===t.keyCode;r&&o&&this.adapter_.notifyIconAction()}}},{key:"activateFocus_",value:function(){var t=e.cssClasses,n=t.BOTTOM_LINE_ACTIVE,i=t.FOCUSED,a=t.LABEL_FLOAT_ABOVE,r=t.LABEL_SHAKE;this.adapter_.addClass(i),this.adapter_.addClassToBottomLine(n),this.adapter_.addClassToLabel(a),this.adapter_.removeClassFromLabel(r),this.showHelptext_(),this.isFocused_=!0}},{key:"setBottomLineTransformOrigin_",value:function(t){var e=t.target.getBoundingClientRect(),n={x:t.clientX,y:t.clientY},i=n.x-e.left,a="transform-origin: "+i+"px center";this.adapter_.setBottomLineAttr("style",a)}},{key:"autoCompleteFocus_",value:function(){this.receivedUserInput_||this.activateFocus_()}},{key:"showHelptext_",value:function(){var t=e.strings.ARIA_HIDDEN;this.adapter_.removeHelptextAttr(t)}},{key:"transitionEnd_",value:function(t){var n=e.cssClasses.BOTTOM_LINE_ACTIVE;"opacity"!==t.propertyName||this.isFocused_||this.adapter_.removeClassFromBottomLine(n)}},{key:"deactivateFocus_",value:function(){var t=e.cssClasses,n=t.FOCUSED,i=t.LABEL_FLOAT_ABOVE,a=t.LABEL_SHAKE,r=this.getNativeInput_();this.isFocused_=!1,this.adapter_.removeClass(n),this.adapter_.removeClassFromLabel(a),r.value||this.isBadInput_()||(this.adapter_.removeClassFromLabel(i),this.receivedUserInput_=!1),this.useCustomValidityChecking_||this.changeValidity_(r.checkValidity())}},{key:"changeValidity_",value:function(t){var n=e.cssClasses,i=n.INVALID,a=n.LABEL_SHAKE;t?this.adapter_.removeClass(i):(this.adapter_.addClassToLabel(a),this.adapter_.addClass(i)),this.updateHelptext_(t)}},{key:"updateHelptext_",value:function(t){var n=e.cssClasses,i=n.HELPTEXT_PERSISTENT,a=n.HELPTEXT_VALIDATION_MSG,r=e.strings.ROLE,o=this.adapter_.helptextHasClass(i),s=this.adapter_.helptextHasClass(a),u=s&&!t;u?this.adapter_.setHelptextAttr(r,"alert"):this.adapter_.removeHelptextAttr(r),o||u||this.hideHelptext_()}},{key:"hideHelptext_",value:function(){var t=e.strings.ARIA_HIDDEN;this.adapter_.setHelptextAttr(t,"true")}},{key:"isBadInput_",value:function(){var t=this.getNativeInput_();return t.validity?t.validity.badInput:t.badInput}},{key:"isDisabled",value:function(){return this.getNativeInput_().disabled}},{key:"setDisabled",value:function(t){var n=e.cssClasses.DISABLED;this.getNativeInput_().disabled=t,t?(this.adapter_.addClass(n),this.adapter_.setIconAttr("tabindex","-1")):(this.adapter_.removeClass(n),this.adapter_.setIconAttr("tabindex","0"))}},{key:"getNativeInput_",value:function(){return this.adapter_.getNativeInput()||{checkValidity:function(){return!0},value:"",disabled:!1,badInput:!1}}},{key:"setValid",value:function(t){this.useCustomValidityChecking_=!0,this.changeValidity_(t)}}]),e}(o.MDCFoundation);e.a=l}})});

foundation.js

@@ -35,16 +35,20 @@ /**
       removeClassFromLabel: (/* className: string */) => {},
+      setIconAttr: (/* name: string, value: string */) => {},
+      eventTargetHasClass: (/* target: HTMLElement, className: string */) => {},
+      registerTextFieldInteractionHandler: () => {},
+      deregisterTextFieldInteractionHandler: () => {},
+      notifyIconAction: () => {},
+      addClassToBottomLine: (/* className: string */) => {},
+      removeClassFromBottomLine: (/* className: string */) => {},
       addClassToHelptext: (/* className: string */) => {},
       removeClassFromHelptext: (/* className: string */) => {},
       helptextHasClass: (/* className: string */) => /* boolean */ false,
-      registerInputFocusHandler: (/* handler: EventListener */) => {},
-      deregisterInputFocusHandler: (/* handler: EventListener */) => {},
-      registerInputBlurHandler: (/* handler: EventListener */) => {},
-      deregisterInputBlurHandler: (/* handler: EventListener */) => {},
-      registerInputInputHandler: (/* handler: EventListener */) => {},
-      deregisterInputInputHandler: (/* handler: EventListener */) => {},
-      registerInputKeydownHandler: (/* handler: EventListener */) => {},
-      deregisterInputKeydownHandler: (/* handler: EventListener */) => {},
+      registerInputInteractionHandler: (/* evtType: string, handler: EventListener */) => {},
+      deregisterInputInteractionHandler: (/* evtType: string, handler: EventListener */) => {},
+      registerTransitionEndHandler: (/* handler: EventListener */) => {},
+      deregisterTransitionEndHandler: (/* handler: EventListener */) => {},
+      setBottomLineAttr: (/* attr: string, value: string */) => {},
       setHelptextAttr: (/* name: string, value: string */) => {},
       removeHelptextAttr: (/* name: string */) => {},
-      getNativeInput: () => /* HTMLInputElement */ ({}),
+      getNativeInput: () => /* HTMLInputElement */ {},
     };
@@ -56,8 +60,11 @@ }
 
+    this.isFocused_ = false;
     this.receivedUserInput_ = false;
+    this.useCustomValidityChecking_ = false;
     this.inputFocusHandler_ = () => this.activateFocus_();
     this.inputBlurHandler_ = () => this.deactivateFocus_();
     this.inputInputHandler_ = () => this.autoCompleteFocus_();
-    this.inputKeydownHandler_ = () => this.receivedUserInput_ = true;
-    this.useCustomValidityChecking_ = false;
+    this.setPointerXOffset_ = (evt) => this.setBottomLineTransformOrigin_(evt);
+    this.textFieldInteractionHandler_ = (evt) => this.handleTextFieldInteraction_(evt);
+    this.transitionEndHandler_ = (evt) => this.transitionEnd_(evt);
   }
@@ -67,7 +74,2 @@
     this.adapter_.addClass(MDCTextfieldFoundation.cssClasses.UPGRADED);
-    this.adapter_.registerInputFocusHandler(this.inputFocusHandler_);
-    this.adapter_.registerInputBlurHandler(this.inputBlurHandler_);
-    this.adapter_.registerInputInputHandler(this.inputInputHandler_);
-    this.adapter_.registerInputKeydownHandler(this.inputKeydownHandler_);
-
     // Ensure label does not collide with any pre-filled value.
@@ -77,2 +79,13 @@ if (this.getNativeInput_().value) {
     }
+
+    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.adapter_.registerTransitionEndHandler(this.transitionEndHandler_);
   }
@@ -82,15 +95,51 @@
     this.adapter_.removeClass(MDCTextfieldFoundation.cssClasses.UPGRADED);
-    this.adapter_.deregisterInputFocusHandler(this.inputFocusHandler_);
-    this.adapter_.deregisterInputBlurHandler(this.inputBlurHandler_);
-    this.adapter_.deregisterInputInputHandler(this.inputInputHandler_);
-    this.adapter_.deregisterInputKeydownHandler(this.inputKeydownHandler_);
+    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_.deregisterTransitionEndHandler(this.transitionEndHandler_);
   }
 
+  handleTextFieldInteraction_(evt) {
+    if (this.adapter_.getNativeInput().disabled) {
+      return;
+    }
+
+    this.receivedUserInput_ = true;
+
+    const {target, type} = evt;
+    const {TEXT_FIELD_ICON} = MDCTextfieldFoundation.cssClasses;
+    const targetIsIcon = this.adapter_.eventTargetHasClass(target, TEXT_FIELD_ICON);
+    const eventTriggersNotification = type === 'click' || evt.key === 'Enter' || evt.keyCode === 13;
+
+    if (targetIsIcon && eventTriggersNotification) {
+      this.adapter_.notifyIconAction();
+    }
+  }
+
   activateFocus_() {
-    const {FOCUSED, LABEL_FLOAT_ABOVE} = MDCTextfieldFoundation.cssClasses;
+    const {BOTTOM_LINE_ACTIVE, FOCUSED, LABEL_FLOAT_ABOVE, LABEL_SHAKE} = MDCTextfieldFoundation.cssClasses;
     this.adapter_.addClass(FOCUSED);
+    this.adapter_.addClassToBottomLine(BOTTOM_LINE_ACTIVE);
     this.adapter_.addClassToLabel(LABEL_FLOAT_ABOVE);
+    this.adapter_.removeClassFromLabel(LABEL_SHAKE);
     this.showHelptext_();
+    this.isFocused_ = true;
   }
 
+  setBottomLineTransformOrigin_(evt) {
+    const targetClientRect = evt.target.getBoundingClientRect();
+    const evtCoords = {x: evt.clientX, y: evt.clientY};
+    const normalizedX = evtCoords.x - targetClientRect.left;
+    const attributeString =
+      `transform-origin: ${normalizedX}px center`;
+
+    this.adapter_.setBottomLineAttr('style', attributeString);
+  }
+
   autoCompleteFocus_() {
@@ -107,7 +156,21 @@ if (!this.receivedUserInput_) {
 
+  transitionEnd_(evt) {
+    const {BOTTOM_LINE_ACTIVE} = MDCTextfieldFoundation.cssClasses;
+
+    // We need to wait for the bottom line to be entirely transparent
+    // before removing the class. If we do not, we see the line start to
+    // scale down before disappearing
+    if (evt.propertyName === 'opacity' && !this.isFocused_) {
+      this.adapter_.removeClassFromBottomLine(BOTTOM_LINE_ACTIVE);
+    }
+  }
+
   deactivateFocus_() {
-    const {FOCUSED, LABEL_FLOAT_ABOVE} = MDCTextfieldFoundation.cssClasses;
+    const {FOCUSED, LABEL_FLOAT_ABOVE, LABEL_SHAKE} = MDCTextfieldFoundation.cssClasses;
     const input = this.getNativeInput_();
 
+    this.isFocused_ = false;
     this.adapter_.removeClass(FOCUSED);
+    this.adapter_.removeClassFromLabel(LABEL_SHAKE);
+
     if (!input.value && !this.isBadInput_()) {
@@ -117,2 +180,3 @@ this.adapter_.removeClassFromLabel(LABEL_FLOAT_ABOVE);
     }
+
     if (!this.useCustomValidityChecking_) {
@@ -124,6 +188,7 @@ this.changeValidity_(input.checkValidity());
   changeValidity_(isValid) {
-    const {INVALID} = MDCTextfieldFoundation.cssClasses;
+    const {INVALID, LABEL_SHAKE} = MDCTextfieldFoundation.cssClasses;
     if (isValid) {
       this.adapter_.removeClass(INVALID);
     } else {
+      this.adapter_.addClassToLabel(LABEL_SHAKE);
       this.adapter_.addClass(INVALID);
@@ -172,4 +237,6 @@ }
       this.adapter_.addClass(DISABLED);
+      this.adapter_.setIconAttr('tabindex', '-1');
     } else {
       this.adapter_.removeClass(DISABLED);
+      this.adapter_.setIconAttr('tabindex', '0');
     }
@@ -176,0 +243,0 @@ }

index.js

@@ -41,2 +41,8 @@ /**
     };
+    if (!this.root_.classList.contains(cssClasses.TEXTAREA)) {
+      this.bottomLine_ = this.root_.querySelector(strings.BOTTOM_LINE_SELECTOR);
+    };
+    if (!this.root_.classList.contains(cssClasses.TEXT_FIELD_ICON)) {
+      this.icon_ = this.root_.querySelector(strings.ICON_SELECTOR);
+    };
   }
@@ -83,15 +89,54 @@
       },
-    }, this.getInputAdapterMethods_(), this.getHelptextAdapterMethods_()));
+      eventTargetHasClass: (target, className) => target.classList.contains(className),
+      registerTextFieldInteractionHandler: (evtType, handler) => this.root_.addEventListener(evtType, handler),
+      deregisterTextFieldInteractionHandler: (evtType, handler) => this.root_.removeEventListener(evtType, handler),
+      notifyIconAction: () => this.emit(MDCTextfieldFoundation.strings.ICON_EVENT),
+    }, this.getInputAdapterMethods_(), this.getHelptextAdapterMethods_(), this.getBottomLineAdapterMethods_(),
+    this.getIconAdapterMethods_()));
   }
 
+  getIconAdapterMethods_() {
+    return {
+      setIconAttr: (name, value) => {
+        if (this.icon_) {
+          this.icon_.setAttribute(name, value);
+        }
+      },
+    };
+  }
+
+  getBottomLineAdapterMethods_() {
+    return {
+      addClassToBottomLine: (className) => {
+        if (this.bottomLine_) {
+          this.bottomLine_.classList.add(className);
+        }
+      },
+      removeClassFromBottomLine: (className) => {
+        if (this.bottomLine_) {
+          this.bottomLine_.classList.remove(className);
+        }
+      },
+      setBottomLineAttr: (attr, value) => {
+        if (this.bottomLine_) {
+          this.bottomLine_.setAttribute(attr, value);
+        }
+      },
+      registerTransitionEndHandler: (handler) => {
+        if (this.bottomLine_) {
+          this.bottomLine_.addEventListener('transitionend', handler);
+        }
+      },
+      deregisterTransitionEndHandler: (handler) => {
+        if (this.bottomLine_) {
+          this.bottomLine_.removeEventListener('transitionend', handler);
+        }
+      },
+    };
+  }
+
   getInputAdapterMethods_() {
     return {
-      registerInputFocusHandler: (handler) => this.input_.addEventListener('focus', handler),
-      registerInputBlurHandler: (handler) => this.input_.addEventListener('blur', handler),
-      registerInputInputHandler: (handler) => this.input_.addEventListener('input', handler),
-      registerInputKeydownHandler: (handler) => this.input_.addEventListener('keydown', handler),
-      deregisterInputFocusHandler: (handler) => this.input_.removeEventListener('focus', handler),
-      deregisterInputBlurHandler: (handler) => this.input_.removeEventListener('blur', handler),
-      deregisterInputInputHandler: (handler) => this.input_.removeEventListener('input', handler),
-      deregisterInputKeydownHandler: (handler) => this.input_.removeEventListener('keydown', handler),
+      registerInputInteractionHandler: (evtType, handler) => this.input_.addEventListener(evtType, handler),
+      deregisterInputInteractionHandler: (evtType, handler) => this.input_.removeEventListener(evtType, handler),
       getNativeInput: () => this.input_,
@@ -98,0 +143,0 @@ };

package.json

 {
   "name": "@material/textfield",
   "description": "The Material Components for the web text field component",
-  "version": "0.4.1",
+  "version": "0.5.0",
   "license": "Apache-2.0",
@@ -17,9 +17,9 @@ "keywords": [
   "dependencies": {
-    "@material/animation": "^0.4.0",
-    "@material/base": "^0.2.5",
-    "@material/ripple": "^0.8.7",
+    "@material/animation": "^0.4.1",
+    "@material/base": "^0.2.6",
+    "@material/ripple": "^0.8.8",
     "@material/rtl": "^0.1.8",
-    "@material/theme": "^0.3.1",
+    "@material/theme": "^0.4.0",
     "@material/typography": "^0.3.0"
   }
 }

README.md

@@ -47,2 +47,3 @@ <!--docs:
   <label class="mdc-textfield__label" for="my-textfield">Hint text</label>
+  <div class="mdc-textfield__bottom-line"></div>
 </div>
@@ -57,2 +58,3 @@ ```
   <span class="mdc-textfield__label">Hint Text</span>
+  <div class="mdc-textfield__bottom-line"></div>
 </label>
@@ -70,2 +72,3 @@ ```
   <input type="text" id="textfield-no-js" class="mdc-textfield__input" placeholder="Hint text">
+  <div class="mdc-textfield__bottom-line"></div>
 </div>
@@ -80,2 +83,3 @@ ```
   <label class="mdc-textfield__label" for="disabled-textfield">Disabled text field</label>
+  <div class="mdc-textfield__bottom-line"></div>
 </div>
@@ -99,2 +103,3 @@ ```
   </label>
+  <div class="mdc-textfield__bottom-line"></div>
 </div>
@@ -112,2 +117,3 @@ ```
   <label for="username" class="mdc-textfield__label">Username</label>
+  <div class="mdc-textfield__bottom-line"></div>
 </div>
@@ -131,2 +137,3 @@ <p id="username-helptext" class="mdc-textfield-helptext" aria-hidden="true">
   <label for="email" class="mdc-textfield__label">Email address</label>
+  <div class="mdc-textfield__bottom-line"></div>
 </div>
@@ -160,2 +167,3 @@ <p class="mdc-textfield-helptext mdc-textfield-helptext--persistent">
   <label for="pw" class="mdc-textfield__label">Password</label>
+  <div class="mdc-textfield__bottom-line"></div>
 </div>
@@ -178,2 +186,3 @@ ```
   <label for="pw" class="mdc-textfield__label">Choose password</label>
+  <div class="mdc-textfield__bottom-line"></div>
 </div>
@@ -188,23 +197,54 @@ <p class="mdc-textfield-helptext
 
-### Multi-line - With Javascript
+### Leading and Trailing Icons
+Leading and trailing icons can be added to MDC Text Fields as visual indicators
+as well as interaction targets. To do so, add the relevant classes
+(`mdc-textfield--with-leading-icon` or `mdc-textfield--with-trailing-icon`) to the root element, add
+an `i` element with your preferred icon, and give it a class of `mdc-textfield__icon`.
 
+#### Leading:
 ```html
-<div class="mdc-textfield mdc-textfield--multiline">
-  <textarea id="multi-line" class="mdc-textfield__input" rows="8" cols="40"></textarea>
-  <label for="multi-line" class="mdc-textfield__label">Multi-line Label</label>
+<div class="mdc-textfield mdc-textfield--box mdc-textfield--with-leading-icon">
+  <i class="material-icons mdc-textfield__icon" tabindex="0">event</i>
+  <input type="text" id="my-input" class="mdc-textfield__input">
+  <label for="my-input" class="mdc-textfield__label">Your Name</label>
+  <div class="mdc-textfield__bottom-line"></div>
 </div>
 ```
 
-### Multi-line - Gracefully Degraded
+#### Trailing:
+```html
+<div class="mdc-textfield mdc-textfield--box mdc-textfield--with-trailing-icon">
+  <input type="text" id="my-input" class="mdc-textfield__input">
+  <label for="my-input" class="mdc-textfield__label">Your Name</label>
+  <i class="material-icons mdc-textfield__icon" tabindex="0">event</i>
+  <div class="mdc-textfield__bottom-line"></div>
+</div>
+```
 
+>**NOTE:** if you would like to display un-clickable icons, simply remove `tabindex="0"`,
+and the css will ensure the cursor is set to default, and that actioning on an icon doesn't
+do anything unexpected.
+
+
+### Textarea
+
 ```html
-<label for="css-only-multiline">Multi-line label: </label>
-<div class="mdc-textfield mdc-textfield--multiline">
-  <textarea class="mdc-textfield__input"
-            id="css-only-multiline"
-            rows="8" cols="40"
-            placeholder="Tell the world something about yourself!"></textarea>
+<div class="mdc-textfield mdc-textfield--textarea">
+  <textarea id="textarea" class="mdc-textfield__input" rows="8" cols="40"></textarea>
+  <label for="textarea" class="mdc-textfield__label">Textarea Label</label>
 </div>
 ```
 
+### Textarea - CSS Only
+
+```html
+<div class="mdc-textfield mdc-textfield--textarea">
+  <textarea id="textarea-css-only"
+    class="mdc-textfield__input"
+    rows="8"
+    cols="40"
+    placeholder="Enter something about yourself"></textarea>
+</div>
+```
+
 ### Full-width
@@ -219,7 +259,6 @@
 </div>
-<div class="mdc-textfield mdc-textfield--multiline mdc-textfield--fullwidth">
-  <textarea class="mdc-textfield__input"
-            placeholder="Full-Width multiline textfield"
-            rows="8" cols="40"
-            aria-label="Full-Width multiline textfield"></textarea>
+
+<div class="mdc-textfield mdc-textfield--fullwidth mdc-textfield--textarea">
+  <textarea id="full-width-textarea" class="mdc-textfield__input" rows="8"></textarea>
+  <label for="full-width-textarea" class="mdc-textfield__label">Textarea Label</label>
 </div>
@@ -229,3 +268,4 @@ ```
 Note that **full-width text fields do not support floating labels**. Labels should not be
-included as part of the DOM structure for full-width text fields.
+included as part of the DOM structure for full-width text fields. Full-width textareas
+behave normally.
 
@@ -359,15 +399,18 @@ ### Text Field Boxes
 | removeClassFromLabel(className: string) => void | Removes a class from the label element |
+| eventTargetHasClass(target: HTMLElement, className: string) => boolean | Returns true if classname exists for a given target element |
+| 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 |
+| notifyIconAction() => void | Emits a custom event "MDCTextfield:icon" denoting a user has clicked the icon |
+| addClassToBottomLine(className: string) => void | Adds a class to the bottom line element |
+| removeClassFromBottomLine(className: string) => void | Removes a class from the bottom line element |
 | addClassToHelptext(className: string) => void | Adds a class to the help text element. Note that in our code we check for whether or not we have a help text element and if we don't, we simply return. |
 | removeClassFromHelptext(className: string) => void | Removes a class from the help text element. |
 | helptextHasClass(className: string) => boolean | Returns whether or not the help text element contains the current class |
-| setHelptextAttr(name: string, value: string) => void | Sets an attribute on the help text element |
-| removeHelptextAttr(name: string) => void | Removes an attribute on the help text element |
-| registerInputFocusHandler(handler: EventListener) => void | Registers an event listener on the native input element for a "focus" event |
-| deregisterInputFocusHandler(handler: EventListener) => void | Un-registers an event listener on the native input element for a "focus" event |
-| registerInputBlurHandler(handler: EventListener) => void | Registers an event listener on the native input element for a "blur" event |
-| deregisterInputBlurHandler(handler: EventListener) => void | Un-registers an event listener on the native input element for a "blur" event |
-| registerInputInputHandler(handler: EventListener) => void | Registers an event listener on the native input element for an "input" event |
-| deregisterInputInputHandler(handler: EventListener) => void | Un-registers an event listener on the native input element for an "input" event |
-| registerInputKeydownHandler(handler: EventListener) => void | Registers an event listener on the native input element for a "keydown" event |
-| deregisterInputKeydownHandler(handler: EventListener) => void | Un-registers an event listener on the native input element for a "keydown" 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 |
+| registerTransitionEndHandler(handler: EventListener) => void | Registers an event listener on the bottom line element for a "transitionend" event |
+| deregisterTransitionEndHandler(handler: EventListener) => void | Deregisters an event listener on the bottom line element for a "transitionend" event |
+| setBottomLineAttr(attr: string, value: string) => void | Sets an attribute with a given value on the bottom line element |
+| setHelptextAttr(name: string, value: string) => void | Sets an attribute with a given value on the help text element |
+| removeHelptextAttr(name: string) => void | Removes an attribute from the help text element |
 | getNativeInput() => {value: string, disabled: boolean, badInput: boolean, checkValidity: () => boolean}? | 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. |
@@ -374,0 +417,0 @@

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

248780

increased by12.44%

Number of package files

12

increased by20%

Lines of code

3445

increased by13.7%

Number of lines in readme file

421

increased by11.38%

Dependency changes

• - Removed@material/theme@0.3.1(transitive)

• Updated@material/animation@^0.4.1

• Updated@material/base@^0.2.6

• Updated@material/ripple@^0.8.8

• Updated@material/theme@^0.4.0