Project import generated by Copybara.
GitOrigin-RevId: 63746295f1a5ab5a619056791995793d65529e62
diff --git a/node_modules/mdl-ext/es/selectfield/selectfield.js b/node_modules/mdl-ext/es/selectfield/selectfield.js
new file mode 100644
index 0000000..5274789
--- /dev/null
+++ b/node_modules/mdl-ext/es/selectfield/selectfield.js
@@ -0,0 +1,271 @@
+'use strict';
+
+var _stringUtils = require('../utils/string-utils');
+
+var _constants = require('../utils/constants');
+
+/**
+ * @license
+ * Copyright 2016 Leif Olsen. 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.
+ *
+ * This code is built with Google Material Design Lite,
+ * which is Licensed under the Apache License, Version 2.0
+ */
+
+/*
+ * Copied/Modified from https://github.com/google/material-design-lite/tree/master/src/textfield
+ */
+
+(function () {
+ 'use strict';
+
+ var LABEL = 'mdlext-selectfield__label';
+ var INPUT = 'mdlext-selectfield__select';
+
+ /**
+ * Class constructor for Selectfield MDLEXT component.
+ * Implements MDL component design pattern defined at:
+ * https://github.com/jasonmayes/mdl-component-design-pattern
+ *
+ * @constructor
+ * @param {HTMLElement} element The element that will be upgraded.
+ */
+ var MaterialExtSelectfield = function MaterialExtSelectfield(element) {
+ this.element_ = element;
+ this.init(); // Initialize instance.
+ };
+
+ window['MaterialExtSelectfield'] = MaterialExtSelectfield;
+
+ /**
+ * Handle focus.
+ *
+ * @param {Event} event The event that fired.
+ * @private
+ */
+ /*eslint no-unused-vars: 0*/
+ MaterialExtSelectfield.prototype.onFocus_ = function () /*event*/{
+ this.element_.classList.add(_constants.IS_FOCUSED);
+ };
+
+ /**
+ * Handle lost focus.
+ *
+ * @param {Event} event The event that fired.
+ * @private
+ */
+ /*eslint no-unused-vars: 0*/
+ MaterialExtSelectfield.prototype.onBlur_ = function () /*event*/{
+ this.element_.classList.remove(_constants.IS_FOCUSED);
+ };
+
+ /**
+ * Handle reset event from out side.
+ *
+ * @param {Event} event The event that fired.
+ * @private
+ */
+ MaterialExtSelectfield.prototype.onReset_ = function () /*event*/{
+ this.updateClasses_();
+ };
+
+ /**
+ * Handle class updates.
+ *
+ * @private
+ */
+ MaterialExtSelectfield.prototype.updateClasses_ = function () {
+ this.checkDisabled();
+ this.checkValidity();
+ this.checkDirty();
+ this.checkFocus();
+ };
+
+ // Public methods.
+
+ /**
+ * Check the disabled state and update field accordingly.
+ *
+ * @public
+ */
+ MaterialExtSelectfield.prototype.checkDisabled = function () {
+ if (this.select_.disabled) {
+ this.element_.classList.add(_constants.IS_DISABLED);
+ } else {
+ this.element_.classList.remove(_constants.IS_DISABLED);
+ }
+ };
+ MaterialExtSelectfield.prototype['checkDisabled'] = MaterialExtSelectfield.prototype.checkDisabled;
+
+ /**
+ * Check the focus state and update field accordingly.
+ *
+ * @public
+ */
+ MaterialExtSelectfield.prototype.checkFocus = function () {
+ // Note: element.querySelector(':focus') always return null in JsDom, even if select element has focus
+ /*eslint no-extra-boolean-cast: 0*/
+ if (Boolean(this.element_.querySelector(':focus'))) {
+ this.element_.classList.add(_constants.IS_FOCUSED);
+ } else {
+ this.element_.classList.remove(_constants.IS_FOCUSED);
+ }
+ };
+
+ MaterialExtSelectfield.prototype['checkFocus'] = MaterialExtSelectfield.prototype.checkFocus;
+
+ /**
+ * Check the validity state and update field accordingly.
+ *
+ * @public
+ */
+ MaterialExtSelectfield.prototype.checkValidity = function () {
+
+ /* Don't think it makes any sense to check validity.
+ Tests I've done, so far, indicates that setting an illegal value via JS returns selectedIndex=0
+ if (this.select_.validity) {
+ if (this.select_.validity.valid) {
+ this.element_.classList.remove(this.CssClasses_.IS_INVALID);
+ } else {
+ this.element_.classList.add(this.CssClasses_.IS_INVALID);
+ }
+ }
+ */
+ };
+
+ MaterialExtSelectfield.prototype['checkValidity'] = MaterialExtSelectfield.prototype.checkValidity;
+
+ /**
+ * Check the dirty state and update field accordingly.
+ *
+ * @public
+ */
+ MaterialExtSelectfield.prototype.checkDirty = function () {
+ if (this.select_.value && this.select_.value.length > 0) {
+ this.element_.classList.add(_constants.IS_DIRTY);
+ } else {
+ this.element_.classList.remove(_constants.IS_DIRTY);
+ }
+ };
+
+ MaterialExtSelectfield.prototype['checkDirty'] = MaterialExtSelectfield.prototype.checkDirty;
+
+ /**
+ * Disable select field.
+ *
+ * @public
+ */
+ MaterialExtSelectfield.prototype.disable = function () {
+ this.select_.disabled = true;
+ this.updateClasses_();
+ };
+
+ MaterialExtSelectfield.prototype['disable'] = MaterialExtSelectfield.prototype.disable;
+
+ /**
+ * Enable select field.
+ *
+ * @public
+ */
+ MaterialExtSelectfield.prototype.enable = function () {
+ this.select_.disabled = false;
+ this.updateClasses_();
+ };
+
+ MaterialExtSelectfield.prototype['enable'] = MaterialExtSelectfield.prototype.enable;
+
+ /**
+ * Update select field value.
+ *
+ * @param {string} value The value to which to set the control (optional).
+ * @public
+ */
+ MaterialExtSelectfield.prototype.change = function (value) {
+ this.select_.value = value || '';
+ this.updateClasses_();
+ };
+ MaterialExtSelectfield.prototype['change'] = MaterialExtSelectfield.prototype.change;
+
+ /**
+ * Initialize element.
+ */
+ MaterialExtSelectfield.prototype.init = function () {
+ if (this.element_) {
+ this.label_ = this.element_.querySelector('.' + LABEL);
+ this.select_ = this.element_.querySelector('.' + INPUT);
+
+ if (this.select_) {
+ // Remove listeners, just in case ...
+ this.select_.removeEventListener('change', this.updateClasses_);
+ this.select_.removeEventListener('focus', this.onFocus_);
+ this.select_.removeEventListener('blur', this.onBlur_);
+ this.select_.removeEventListener('reset', this.onReset_);
+
+ this.select_.addEventListener('change', this.updateClasses_.bind(this));
+ this.select_.addEventListener('focus', this.onFocus_.bind(this));
+ this.select_.addEventListener('blur', this.onBlur_.bind(this));
+ this.select_.addEventListener('reset', this.onReset_.bind(this));
+
+ if (this.label_) {
+ var id = void 0;
+ if (!this.select_.hasAttribute('id')) {
+ id = 'select-' + (0, _stringUtils.randomString)();
+ this.select_.id = id;
+ } else {
+ id = this.select_.id;
+ }
+
+ if (!this.label_.hasAttribute('for')) {
+ this.label_.setAttribute('for', id);
+ }
+ }
+
+ var invalid = this.element_.classList.contains(_constants.IS_INVALID);
+ this.updateClasses_();
+ this.element_.classList.add(_constants.IS_UPGRADED);
+
+ if (invalid) {
+ this.element_.classList.add(_constants.IS_INVALID);
+ }
+ if (this.select_.hasAttribute('autofocus')) {
+ this.element_.focus();
+ this.checkFocus();
+ }
+ }
+ }
+ };
+
+ /**
+ * Downgrade component
+ * E.g remove listeners and clean up resources
+ *
+ * Nothing to downgrade
+ *
+ MaterialExtSelectfield.prototype.mdlDowngrade_ = function() {
+ 'use strict';
+ console.log('***** MaterialExtSelectfield.mdlDowngrade ');
+ };
+ */
+
+ // The component registers itself. It can assume componentHandler is available
+ // in the global scope.
+ /*eslint no-undef: 0*/
+ componentHandler.register({
+ constructor: MaterialExtSelectfield,
+ classAsString: 'MaterialExtSelectfield',
+ cssClass: 'mdlext-js-selectfield',
+ widget: true
+ });
+})();
\ No newline at end of file