text: (function (global, factory) {
    if (typeof define === "function" && define.amd) {
      define(['exports', 'react', 'classnames', 'react-dom', 'react-prop-types/lib/deprecated', 'react-prop-types/lib/isRequiredForA11y', '../constants/keyCodes', '../utils/getField', '../utils/PropTypes/controlled', '../utils/NumberUtils/isBetween', '../utils/StringUtils/addSuffix', '../Lists/List', '../Lists/ListItem', '../Menus/Menu', '../Menus/Positions', '../TextFields/FloatingLabel', '../TextFields/TextFieldMessage', './Field'], factory);
    } else if (typeof exports !== "undefined") {
      factory(exports, require('react'), require('classnames'), require('react-dom'), require('react-prop-types/lib/deprecated'), require('react-prop-types/lib/isRequiredForA11y'), require('../constants/keyCodes'), require('../utils/getField'), require('../utils/PropTypes/controlled'), require('../utils/NumberUtils/isBetween'), require('../utils/StringUtils/addSuffix'), require('../Lists/List'), require('../Lists/ListItem'), require('../Menus/Menu'), require('../Menus/Positions'), require('../TextFields/FloatingLabel'), require('../TextFields/TextFieldMessage'), require('./Field'));
    } else {
      var mod = {
        exports: {}
      };
      factory(mod.exports, global.react, global.classnames, global.reactDom, global.deprecated, global.isRequiredForA11y, global.keyCodes, global.getField, global.controlled, global.isBetween, global.addSuffix, global.List, global.ListItem, global.Menu, global.Positions, global.FloatingLabel, global.TextFieldMessage, global.Field);
      global.SelectField = mod.exports;
    }
  })(this, function (exports, _react, _classnames, _reactDom, _deprecated, _isRequiredForA11y, _keyCodes, _getField, _controlled, _isBetween, _addSuffix, _List, _ListItem, _Menu, _Positions, _FloatingLabel, _TextFieldMessage, _Field) {
    'use strict';
  
    Object.defineProperty(exports, "__esModule", {
      value: true
    });
  
    var _react2 = _interopRequireDefault(_react);
  
    var _classnames2 = _interopRequireDefault(_classnames);
  
    var _deprecated2 = _interopRequireDefault(_deprecated);
  
    var _isRequiredForA11y2 = _interopRequireDefault(_isRequiredForA11y);
  
    var _getField2 = _interopRequireDefault(_getField);
  
    var _controlled2 = _interopRequireDefault(_controlled);
  
    var _isBetween2 = _interopRequireDefault(_isBetween);
  
    var _addSuffix2 = _interopRequireDefault(_addSuffix);
  
    var _List2 = _interopRequireDefault(_List);
  
    var _ListItem2 = _interopRequireDefault(_ListItem);
  
    var _Menu2 = _interopRequireDefault(_Menu);
  
    var _Positions2 = _interopRequireDefault(_Positions);
  
    var _FloatingLabel2 = _interopRequireDefault(_FloatingLabel);
  
    var _TextFieldMessage2 = _interopRequireDefault(_TextFieldMessage);
  
    var _Field2 = _interopRequireDefault(_Field);
  
    function _interopRequireDefault(obj) {
      return obj && obj.__esModule ? obj : {
        default: obj
      };
    }
  
    function _objectWithoutProperties(obj, keys) {
      var target = {};
  
      for (var i in obj) {
        if (keys.indexOf(i) >= 0) continue;
        if (!Object.prototype.hasOwnProperty.call(obj, i)) continue;
        target[i] = obj[i];
      }
  
      return target;
    }
  
    var _extends = Object.assign || function (target) {
      for (var i = 1; i < arguments.length; i++) {
        var source = arguments[i];
  
        for (var key in source) {
          if (Object.prototype.hasOwnProperty.call(source, key)) {
            target[key] = source[key];
          }
        }
      }
  
      return target;
    };
  
    var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) {
      return typeof obj;
    } : function (obj) {
      return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
    };
  
    function _classCallCheck(instance, Constructor) {
      if (!(instance instanceof Constructor)) {
        throw new TypeError("Cannot call a class as a function");
      }
    }
  
    var _createClass = function () {
      function defineProperties(target, props) {
        for (var i = 0; i < props.length; i++) {
          var descriptor = props[i];
          descriptor.enumerable = descriptor.enumerable || false;
          descriptor.configurable = true;
          if ("value" in descriptor) descriptor.writable = true;
          Object.defineProperty(target, descriptor.key, descriptor);
        }
      }
  
      return function (Constructor, protoProps, staticProps) {
        if (protoProps) defineProperties(Constructor.prototype, protoProps);
        if (staticProps) defineProperties(Constructor, staticProps);
        return Constructor;
      };
    }();
  
    function _possibleConstructorReturn(self, call) {
      if (!self) {
        throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
      }
  
      return call && (typeof call === "object" || typeof call === "function") ? call : self;
    }
  
    function _inherits(subClass, superClass) {
      if (typeof superClass !== "function" && superClass !== null) {
        throw new TypeError("Super expression must either be null or a function, not " + typeof superClass);
      }
  
      subClass.prototype = Object.create(superClass && superClass.prototype, {
        constructor: {
          value: subClass,
          enumerable: false,
          writable: true,
          configurable: true
        }
      });
      if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass;
    }
  
    var VALID_LIST_ITEM_PROPS = Object.keys(_ListItem2.default.propTypes);
  
    var MOBILE_LIST_PADDING = 8;
    var SelectFieldPositions = Object.assign({}, _Positions2.default);
    delete SelectFieldPositions.BOTTOM_RIGHT;
    delete SelectFieldPositions.BOTTOM_LEFt;
  
    var SelectField = function (_PureComponent) {
      _inherits(SelectField, _PureComponent);
  
      function SelectField(props) {
        _classCallCheck(this, SelectField);
  
        var _this = _possibleConstructorReturn(this, (SelectField.__proto__ || Object.getPrototypeOf(SelectField)).call(this, props));
  
        _this.state = {
          active: false,
          activeIndex: _this._getActiveIndex(props, { value: props.defaultValue }),
          isOpen: typeof props.initiallyOpen !== 'undefined' ? props.initiallyOpen : !!props.defaultOpen,
          activeLabel: _this._getActiveLabel(props, typeof props.value !== 'undefined' ? props.value : props.defaultValue),
          match: null,
          lastSearch: null,
          error: false
        };
  
        if (typeof props.value === 'undefined') {
          _this.state.value = props.defaultValue;
        }
  
        _this._setMenu = _this._setMenu.bind(_this);
        _this._setField = _this._setField.bind(_this);
        _this._positionList = _this._positionList.bind(_this);
        _this._toggleOpen = _this._toggleOpen.bind(_this);
        _this._handleBlur = _this._handleBlur.bind(_this);
        _this._handleFocus = _this._handleFocus.bind(_this);
        _this._handleOpen = _this._handleOpen.bind(_this);
        _this._handleClose = _this._handleClose.bind(_this);
        _this._getActiveLabel = _this._getActiveLabel.bind(_this);
        _this._mapToListItem = _this._mapToListItem.bind(_this);
        _this._handleItemSelect = _this._handleItemSelect.bind(_this);
        _this._handleContainerClick = _this._handleContainerClick.bind(_this);
        _this._handleKeyDown = _this._handleKeyDown.bind(_this);
        _this._setMenuItem = _this._setMenuItem.bind(_this);
        _this._getActiveIndex = _this._getActiveIndex.bind(_this);
        _this._advanceFocus = _this._advanceFocus.bind(_this);
        _this._attemptItemFocus = _this._attemptItemFocus.bind(_this);
        _this._selectItemByLetter = _this._selectItemByLetter.bind(_this);
        _this._selectFirstMatch = _this._selectFirstMatch.bind(_this);
  
        _this._items = [];
        _this._activeItem = null;
        return _this;
      }
  
      _createClass(SelectField, [{
        key: 'componentWillUpdate',
        value: function componentWillUpdate(nextProps, nextState) {
          var prevValue = (0, _getField2.default)(this.props, this.state, 'value');
          var value = (0, _getField2.default)(nextProps, nextState, 'value');
          var error = (0, _getField2.default)(nextProps, nextState, 'error');
          var isOpen = (0, _getField2.default)(nextProps, nextState, 'isOpen');
          var valued = !(0, _getField2.default)(nextProps, nextState, 'value');
  
          var state = void 0;
          if (prevValue !== value || this.props.menuItems !== nextProps.menuItems) {
            state = {
              activeLabel: this._getActiveLabel(nextProps, value)
            };
          }
  
          if (nextProps.required && !isOpen && error !== valued) {
            state = state || {};
            state.error = valued;
          }
  
          if (state) {
            this.setState(state);
          }
        }
      }, {
        key: 'componentWillUnmount',
        value: function componentWillUnmount() {
          if (this._matchingTimeout) {
            clearTimeout(this._matchingTimeout);
          }
        }
      }, {
        key: '_attemptItemFocus',
        value: function _attemptItemFocus(index) {
          if (index === -1) {
            return;
          }
  
          var item = this._items[index];
          if (item) {
            item.focus();
          }
        }
      }, {
        key: '_getActiveLabel',
        value: function _getActiveLabel(_ref, value) {
          var _this2 = this;
  
          var menuItems = _ref.menuItems,
              itemLabel = _ref.itemLabel,
              itemValue = _ref.itemValue;
  
          var activeLabel = '';
          menuItems.some(function (item) {
            activeLabel = _this2._getActiveLabelFromItem(item, value, itemLabel, itemValue);
            return activeLabel;
          });
  
          return activeLabel;
        }
      }, {
        key: '_getActiveLabelFromItem',
        value: function _getActiveLabelFromItem(item, value, itemLabel, itemValue) {
          switch (typeof item === 'undefined' ? 'undefined' : _typeof(item)) {
            case 'number':
            case 'string':
              if (item === value || item === parseInt(value, 10)) {
                return item;
              }
  
              break;
            case 'object':
              if (item[itemValue] === value || item[itemValue] === parseInt(value, 10)) {
                return item[itemLabel];
              }
  
              break;
            default:
          }
  
          return '';
        }
      }, {
        key: '_getActiveIndex',
        value: function _getActiveIndex(props, state) {
          var _this3 = this;
  
          var value = (0, _getField2.default)(props, state, 'value');
          if (!value) {
            return -1;
          }
  
          var itemLabel = props.itemLabel,
              itemValue = props.itemValue,
              menuItems = props.menuItems;
  
          var index = -1;
          menuItems.some(function (item, i) {
            var found = _this3._getActiveLabelFromItem(item, value, itemLabel, itemValue);
            if (found) {
              index = i;
            }
  
            return found;
          });
  
          return index;
        }
      }, {
        key: '_setMenu',
        value: function _setMenu(menu) {
          this._menu = (0, _reactDom.findDOMNode)(menu);
        }
      }, {
        key: '_setField',
        value: function _setField(field) {
          this._field = (0, _reactDom.findDOMNode)(field);
        }
      }, {
        key: '_positionList',
        value: function _positionList(listRef) {
          if (listRef === null) {
            this._items = [];
          } else if (!this._activeItem) {
            return;
          }
  
          var list = (0, _reactDom.findDOMNode)(listRef);
          var _props = this.props,
              position = _props.position,
              menuItems = _props.menuItems,
              toolbar = _props.toolbar;
  
          if (position === SelectField.Positions.BELOW || toolbar) {
            // only modify scroll distance when below
            var activeIndex = Math.min(this._activeItem, menuItems.length - 2);
            var _itemTop = list.querySelectorAll('.md-list-tile')[activeIndex].offsetTop;
  
            list.scrollTop = _itemTop > MOBILE_LIST_PADDING ? _itemTop : 0;
            return;
          }
  
          var _activeItem = this._activeItem,
              itemTop = _activeItem.offsetTop,
              itemHeight = _activeItem.offsetHeight;
          var menuHeight = this._menu.offsetHeight;
  
          var itemPosition = Math.max(0, itemTop - itemHeight);
          var listPadding = parseInt(window.getComputedStyle(list).getPropertyValue('padding-top'), 10);
  
          // Basically calculates where the current item is in the list, and attempts to make the menu
          // originate from that position.
          var x = SelectField.Positions.TOP_LEFT === position ? '0' : '100%';
          var y = (itemPosition === 0 ? 0 : menuHeight) + menuHeight / 2 + listPadding;
          var transformOrigin = x + ' ' + y + 'px';
  
          var top = void 0;
          if (itemPosition > 0) {
            // close enough. It is off by 4px for floating label on desktop
            top = -(itemHeight + listPadding - (menuHeight - itemHeight));
          }
  
          if (itemPosition > 0) {
            list.scrollTop = itemPosition;
          }
  
          this.setState({
            listStyle: {
              top: top,
              transformOrigin: transformOrigin
            }
          });
        }
      }, {
        key: '_handleFocus',
        value: function _handleFocus(e) {
          if (this.props.onFocus) {
            this.props.onFocus(e);
          }
  
          this.setState({ active: true });
        }
      }, {
        key: '_handleBlur',
        value: function _handleBlur(e) {
          if (this.props.onBlur) {
            this.props.onBlur(e);
          }
  
          var isOpen = (0, _getField2.default)(this.props, this.state, 'isOpen');
          var value = (0, _getField2.default)(this.props, this.state, 'value');
  
          this.setState({
            active: false,
            error: this.props.required && !isOpen && !value
          });
        }
      }, {
        key: '_handleItemSelect',
        value: function _handleItemSelect(index, v, e) {
          var _props2 = this.props,
              required = _props2.required,
              menuItems = _props2.menuItems,
              itemLabel = _props2.itemLabel,
              itemValue = _props2.itemValue,
              onChange = _props2.onChange,
              position = _props2.position;
  
          var number = typeof menuItems[index] === 'number' || typeof menuItems[index][itemValue] === 'number';
          var value = number ? Number(v) : v;
  
          var below = position === SelectField.Positions.BELOW;
          if ((0, _getField2.default)(this.props, this.state, 'value') !== value && onChange) {
            onChange(value, index, e);
          }
  
          var state = {
            activeIndex: below ? 0 : index,
            activeLabel: this._getActiveLabelFromItem(menuItems[index], value, itemLabel, itemValue),
            error: required && !value
          };
  
          if (typeof this.props.value === 'undefined') {
            state.value = value;
          }
  
          if (typeof this.props.isOpen === 'undefined' && e.type !== 'click') {
            state.isOpen = false;
          }
  
          this.setState(state);
        }
      }, {
        key: '_handleContainerClick',
        value: function _handleContainerClick(e) {
          if (this.props.onClick) {
            this.props.onClick(e);
          }
  
          var target = e.target;
  
          while (this._menu && this._menu.contains(target)) {
            if (target.dataset.id) {
              this._handleItemSelect(parseInt(target.dataset.id, 10), target.dataset.value, e);
              return;
            }
  
            target = target.parentNode;
          }
        }
      }, {
        key: '_toggleOpen',
        value: function _toggleOpen(e) {
          var isOpen = !(0, _getField2.default)(this.props, this.state, 'isOpen');
          if (this.props.onMenuToggle) {
            this.props.onMenuToggle(isOpen, e);
          }
  
          if (typeof this.props.isOpen === 'undefined') {
            this.setState({ isOpen: isOpen });
          }
        }
      }, {
        key: '_handleOpen',
        value: function _handleOpen(e) {
          if (this.props.onMenuToggle) {
            this.props.onMenuToggle(true, e);
          }
  
          var state = void 0;
          if (!(0, _getField2.default)(this.props, this.state, 'value') && this.state.activeIndex === -1) {
            // When there is no value, need to change the default active index to 0 instead of -1
            // so that the next DOWN arrow increments correctly
            state = { activeIndex: 0 };
          }
  
          if (typeof this.props.isOpen === 'undefined') {
            state = state || {};
            state.isOpen = true;
          }
  
          if (state) {
            this.setState(state);
          }
        }
      }, {
        key: '_handleClose',
        value: function _handleClose(e) {
          if (this.props.onMenuToggle) {
            this.props.onMenuToggle(false, e);
          }
  
          var state = void 0;
          if (this.props.position === SelectField.Positions.BELOW) {
            // Set the active index back to 0 since the active item will be spliced out
            // of the menu items
            state = { activeIndex: 0 };
          }
  
          if (typeof this.props.isOpen === 'undefined') {
            state = state || {};
            state.isOpen = false;
          }
  
          if (state) {
            this.setState(state);
          }
        }
      }, {
        key: '_mapToListItem',
        value: function _mapToListItem(item, i) {
          var _props3 = this.props,
              id = _props3.id,
              itemLabel = _props3.itemLabel,
              itemValueKey = _props3.itemValue,
              position = _props3.position;
  
          var below = position === SelectField.Positions.BELOW;
          var value = (0, _getField2.default)(this.props, this.state, 'value');
  
          var primaryText = '';
          var itemValue = '';
          var props = void 0;
          switch (typeof item === 'undefined' ? 'undefined' : _typeof(item)) {
            case 'number':
            case 'string':
              primaryText = item;
              itemValue = item;
              break;
            case 'object':
              primaryText = item[itemLabel];
              itemValue = typeof item[itemValueKey] !== 'undefined' ? item[itemValueKey] : item[itemLabel];
              props = Object.keys(item).reduce(function (validProps, key) {
                if (key !== itemLabel && key !== itemValueKey && key !== 'primaryText' && VALID_LIST_ITEM_PROPS.indexOf(key) !== -1) {
                  validProps[key] = item[key];
                }
  
                return validProps;
              }, {});
              break;
            default:
          }
  
          var active = itemValue === value || itemValue === parseInt(value, 10);
          if (below && active) {
            return null;
          }
  
          return _react2.default.createElement(_ListItem2.default, _extends({}, props, {
            ref: this._setMenuItem,
            active: active,
            tabIndex: -1,
            primaryText: primaryText,
            key: item.key || i,
            role: 'option',
            id: active ? id + 'Active' : null,
            'data-id': i,
            'data-value': itemValue,
            tileStyle: below ? { paddingLeft: 24 } : undefined
          }));
        }
      }, {
        key: '_setMenuItem',
        value: function _setMenuItem(item) {
          if (!item) {
            return;
          }
  
          if (item.props.active) {
            this._activeItem = (0, _reactDom.findDOMNode)(item);
            item.focus();
          }
  
          this._items.push(item);
        }
      }, {
        key: '_handleKeyDown',
        value: function _handleKeyDown(e) {
          var key = e.which || e.keyCode;
          var isOpen = (0, _getField2.default)(this.props, this.state, 'isOpen');
  
          if (key === _keyCodes.UP || key === _keyCodes.DOWN) {
            e.preventDefault();
          }
  
          if (!isOpen && (key === _keyCodes.DOWN || key === _keyCodes.UP || key === _keyCodes.ENTER)) {
            this._handleOpen(e);
            return;
          } else if (isOpen && (key === _keyCodes.ESC || key === _keyCodes.TAB)) {
            if (this._field && key === _keyCodes.ESC) {
              this._field.focus();
            }
  
            this._handleClose(e);
            return;
          }
  
          switch (key) {
            case _keyCodes.UP:
            case _keyCodes.DOWN:
              this._advanceFocus(key === _keyCodes.UP, e);
              break;
            case _keyCodes.ENTER:
              if (this._field) {
                this._field.focus();
              }
  
              this._handleContainerClick(e);
              break;
            default:
              this._selectItemByLetter(e, key);
          }
        }
      }, {
        key: '_advanceFocus',
        value: function _advanceFocus(decrement) {
          var _props4 = this.props,
              menuItems = _props4.menuItems,
              position = _props4.position;
          var activeIndex = this.state.activeIndex;
  
  
          var below = position === SelectField.Positions.BELOW;
  
          // If the select field is positioned below and there is no value, need to increment the last index
          // by one since this select field removes the active item. Need to account for that here when there
          // is no value.
          var lastIndex = menuItems.length - (below && !(0, _getField2.default)(this.props, this.state, 'value') ? 0 : 1);
          if (decrement && activeIndex <= 0 || !decrement && activeIndex >= lastIndex) {
            return;
          }
  
          var nextIndex = Math.max(-1, Math.min(lastIndex, activeIndex + (decrement ? -1 : 1)));
          if (nextIndex === activeIndex) {
            return;
          }
  
          this._attemptItemFocus(nextIndex - (below ? 1 : 0));
          if (below && decrement && nextIndex === 0) {
            return;
          }
  
          this.setState({ activeIndex: nextIndex });
        }
      }, {
        key: '_selectItemByLetter',
        value: function _selectItemByLetter(e, key) {
          var _this4 = this;
  
          var charCode = String.fromCharCode(key);
          var isLetter = charCode && charCode.match(/[A-Za-z0-9-_ ]/);
          var isKeypad = (0, _isBetween2.default)(key, _keyCodes.KEYPAD_ZERO, _keyCodes.KEYPAD_NINE);
          if (!(0, _isBetween2.default)(key, _keyCodes.ZERO, _keyCodes.NINE) && !isKeypad && !isLetter) {
            return;
          }
  
          var letter = isLetter ? charCode : String(key - (isKeypad ? _keyCodes.KEYPAD_ZERO : _keyCodes.ZERO));
  
          if (this._matchingTimeout) {
            clearTimeout(this._matchingTimeout);
          }
  
          this._matchingTimeout = setTimeout(function () {
            _this4._matchingTimeout = null;
  
            _this4.setState({ match: null, lastSearch: null });
          }, this.props.keyboardMatchingTimeout);
  
          this._selectFirstMatch(letter, e);
        }
      }, {
        key: '_selectFirstMatch',
        value: function _selectFirstMatch(letter, e) {
          var _props5 = this.props,
              menuItems = _props5.menuItems,
              itemLabel = _props5.itemLabel,
              itemValue = _props5.itemValue;
  
  
          var search = '' + (this.state.lastSearch || '') + letter;
          var match = -1;
          menuItems.some(function (item, i) {
            var value = String((typeof item === 'undefined' ? 'undefined' : _typeof(item)) === 'object' && item ? item[itemLabel] : item);
            if (value && value.toUpperCase().indexOf(search) === 0) {
              match = i;
            }
  
            return match > -1;
          });
  
          var activeItem = menuItems[match];
  
          var state = {
            match: match,
            lastSearch: search
          };
  
          if (match === -1) {
            this.setState(state);
            return;
          }
  
          state.activeLabel = (typeof activeItem === 'undefined' ? 'undefined' : _typeof(activeItem)) === 'object' ? activeItem[itemLabel] : activeItem;
          state.activeIndex = match;
  
          if ((0, _getField2.default)(this.props, this.state, 'isOpen')) {
            if (state.match !== this.state.match) {
              this._attemptItemFocus(state.activeIndex);
            }
          } else {
            var value = (typeof activeItem === 'undefined' ? 'undefined' : _typeof(activeItem)) === 'object' ? activeItem[itemValue] : activeItem;
            state.error = !value;
  
            if ((0, _getField2.default)(this.props, this.state, 'value') !== value && this.props.onChange) {
              this.props.onChange(value, state.activeIndex, e);
            }
  
            if (typeof this.props.value === 'undefined') {
              state.value = value;
            }
          }
  
          this.setState(state);
        }
      }, {
        key: 'render',
        value: function render() {
          var _state = this.state,
              activeLabel = _state.activeLabel,
              active = _state.active;
  
          var _props6 = this.props,
              id = _props6.id,
              style = _props6.style,
              className = _props6.className,
              listStyle = _props6.listStyle,
              listClassName = _props6.listClassName,
              inputStyle = _props6.inputStyle,
              inputClassName = _props6.inputClassName,
              disabled = _props6.disabled,
              menuItems = _props6.menuItems,
              position = _props6.position,
              stretchList = _props6.stretchList,
              errorText = _props6.errorText,
              helpText = _props6.helpText,
              helpOnFocus = _props6.helpOnFocus,
              required = _props6.required,
              fullWidth = _props6.fullWidth,
              props = _objectWithoutProperties(_props6, ['id', 'style', 'className', 'listStyle', 'listClassName', 'inputStyle', 'inputClassName', 'disabled', 'menuItems', 'position', 'stretchList', 'errorText', 'helpText', 'helpOnFocus', 'required', 'fullWidth']);
  
          delete props.error;
          delete props.itemLabel;
          delete props.itemValue;
          delete props.menuId;
          delete props.listId;
          delete props.defaultValue;
          delete props.value;
          delete props.isOpen;
          delete props.defaultOpen;
          delete props.keyboardMatchingTimeout;
          delete props.onMenuToggle;
  
          // delete deprecated
          delete props.menuStyle;
          delete props.menuClassName;
          delete props.initiallyOpen;
          delete props.floatingLabel;
          delete props.noAutoAdjust;
          delete props.adjustMinWidth;
  
          var _props7 = this.props,
              menuId = _props7.menuId,
              listId = _props7.listId,
              placeholder = _props7.placeholder,
              label = _props7.label,
              error = _props7.error;
  
          error = error || this.state.error;
          var value = (0, _getField2.default)(this.props, this.state, 'value');
          var isOpen = (0, _getField2.default)(this.props, this.state, 'isOpen');
          var below = position === SelectField.Positions.BELOW;
  
          if (!menuId) {
            menuId = id + 'Menu';
          }
  
          if (!listId) {
            listId = id + 'Values';
          }
  
          if (required) {
            if (label) {
              label = (0, _addSuffix2.default)(label, '*');
            }
  
            if (placeholder && !label) {
              placeholder = (0, _addSuffix2.default)(placeholder, '*');
            }
          }
  
          var toggle = [_react2.default.createElement(_FloatingLabel2.default, {
            key: 'floating-label',
            label: label,
            htmlFor: id,
            active: active || isOpen,
            error: error,
            floating: !!activeLabel || active || isOpen,
            disabled: disabled
          }), _react2.default.createElement(_Field2.default, _extends({}, props, {
            id: id,
            ref: this._setField,
            key: 'select-field',
            style: inputStyle,
            className: inputClassName,
            activeLabel: activeLabel,
            required: required,
            disabled: disabled,
            active: active || isOpen,
            below: below,
            value: value,
            label: label,
            error: error,
            placeholder: placeholder,
            onClick: this._toggleOpen,
            onFocus: this._handleFocus,
            onBlur: this._handleBlur
          })), _react2.default.createElement(_TextFieldMessage2.default, {
            key: 'message',
            active: active || isOpen,
            error: error,
            errorText: errorText,
            helpText: helpText,
            helpOnFocus: helpOnFocus,
            leftIcon: false,
            rightIcon: false
          })];
  
          return _react2.default.createElement(
            _Menu2.default,
            {
              id: menuId,
              position: position,
              isOpen: isOpen,
              onClose: this._handleClose,
              onClick: this._handleContainerClick,
              onKeyDown: this._handleKeyDown,
              toggle: toggle,
              style: style,
              className: (0, _classnames2.default)('md-select-field-menu', {
                'md-select-field-menu--stretch': stretchList
              }, className),
              ref: this._setMenu,
              fullWidth: fullWidth
            },
            _react2.default.createElement(
              _List2.default,
              {
                id: listId,
                role: 'listbox',
                ref: this._positionList,
                'aria-activedescendant': value ? id + 'Active' : null,
                style: _extends({}, listStyle, this.state.listStyle),
                className: listClassName
              },
              menuItems.map(this._mapToListItem).filter(function (item) {
                return item !== null;
              })
            )
          );
        }
      }]);
  
      return SelectField;
    }(_react.PureComponent);
  
    SelectField.Positions = SelectFieldPositions;
    SelectField.propTypes = {
      /**
       * An id to use for the select field. This is required for a11y. If the `menuId` and
       * `listId` are not given, this will be used to create their ids for a11y.
       */
      id: (0, _isRequiredForA11y2.default)(_react.PropTypes.oneOfType([_react.PropTypes.number, _react.PropTypes.string])),
  
      /**
       * An optional name to give the select field's input.
       */
      name: _react.PropTypes.string,
  
      /**
       * An id to give the menu containing the select field. If this is omitted, the `id` prop
       * will be used to make this id. `${id}Menu`.
       */
      menuId: _react.PropTypes.oneOfType([_react.PropTypes.number, _react.PropTypes.string]),
  
      /**
       * An id to give the list that appears once the menu is open. If this is omitted, the `id` prop
       * will be used to make this id. `${id}Values`.
       */
      listId: _react.PropTypes.oneOfType([_react.PropTypes.number, _react.PropTypes.string]),
  
      /**
       * An optional style to apply to the select field's container. This is the `Menu` component.
       */
      style: _react.PropTypes.object,
  
      /**
       * An optional style to apply to the select field's container. This is the `Menu` component.
       */
      className: _react.PropTypes.string,
  
      /**
       * An optional style to apply to the select field's list of items that appear when opened.
       */
      listStyle: _react.PropTypes.object,
  
      /**
       * An optional className to apply to the select field's list of items that appear when opened.
       */
      listClassName: _react.PropTypes.string,
  
      /**
       * An optional style to apply to the select field itself.
       */
      inputStyle: _react.PropTypes.object,
  
      /**
       * An optional className to apply to the select field itself.
       */
      inputClassName: _react.PropTypes.string,
  
      /**
       * An optional value for the select field. This will require the `onChange` prop
       * to be defined since it will be a controlled component.
       */
      value: (0, _controlled2.default)(_react.PropTypes.oneOfType([_react.PropTypes.number, _react.PropTypes.string]), 'onChange'),
  
      /**
       * The default value for an uncontrolled select field.
       */
      defaultValue: _react.PropTypes.oneOfType([_react.PropTypes.number, _react.PropTypes.string]).isRequired,
  
      /**
       * Boolean if the select field is open by default.
       */
      defaultOpen: _react.PropTypes.bool,
  
      /**
       * An optional boolean if the select field is currently open. This will make the component
       * controlled and require the `onMenuToggle` prop to be defined.
       */
      isOpen: (0, _controlled2.default)(_react.PropTypes.bool, 'onMenuToggle', 'defaultOpen'),
  
      /**
       * An optional function to call when the menu's open state changes. The callback will include
       * the next open state and the event that driggered it.
       *
       * ```js
       * onMenuToggle(isOpen, event);
       * ```
       */
      onMenuToggle: _react.PropTypes.func,
  
      /**
       * An optional function to call when the value for the select field changes. The callback will
       * include the new value, the index of the menu item that was selected, and the event that
       * triggered the change.
       *
       * ```js
       * onChange(newValue, newActiveIndex, event);
       * ```
       */
      onChange: _react.PropTypes.func,
  
      /**
       * A list of items to select from. This can be a mixed list of number, string,
       * or object. If the item is an object, make sure the `itemLabel` and `itemValue`
       * props match the keys in the object for the label and value.
       */
      menuItems: _react.PropTypes.arrayOf(_react.PropTypes.oneOfType([_react.PropTypes.number, _react.PropTypes.string, _react.PropTypes.object])),
  
      /**
       * An optional floating label to display with the text field. This is invalid
       * if the `position` is set to `SelectField.Positions.BELOW`.
       */
      label: _react.PropTypes.string,
  
      /**
       * An optional placeholder to display in the select field.
       */
      placeholder: _react.PropTypes.string,
  
      /**
       * Boolean if the select field is disabled.
       */
      disabled: _react.PropTypes.bool,
  
      /**
       * The key to use for extracting a menu item's label if the menu item is an object.
       *
       * Example:
       *
       * ```js
       * const item = { something: 'My Label', somethingElse: 'value' };
       * const itemLabel = 'something';
       * const itemValue = 'somethingElse';
       * ```
       */
      itemLabel: _react.PropTypes.string.isRequired,
  
      /**
       * The key to use for extracting a menu item'value label if the menu item is an object.
       *
       * Example:
       *
       * ```js
       * const item = { something: 'My Label', somethingElse: 'value' };
       * const itemLabel = 'something';
       * const itemValue = 'somethingElse';
       * ```
       */
      itemValue: _react.PropTypes.string.isRequired,
  
      /**
       * Any children used to display the select field's drop down icon.
       */
      iconChildren: _react.PropTypes.node,
  
      /**
       * The icon class name to use to display the select field's drop down icon.
       */
      iconClassName: _react.PropTypes.string,
  
      /*
       * An optional function to call when the menu is clicked.
       */
      onClick: _react.PropTypes.func,
  
      /**
       * The position that the select field's options should appear from. If the position is
       * set to `BELOW`, the select field will be displayed as a button with ink instead of
       * a text field.
       */
      position: _react.PropTypes.oneOf([SelectField.Positions.TOP_LEFT, SelectField.Positions.TOP_RIGHT, SelectField.Positions.BELOW]).isRequired,
  
      /*
       * The direction that the select field's focus indicator should grow from.
       */
      lineDirection: _react.PropTypes.oneOf(['left', 'center', 'right']).isRequired,
  
      /**
       * An optional function to call when the select field is focused.
       */
      onFocus: _react.PropTypes.func,
  
      /**
       * An optional function to call when the select field is blurred. This
       * will also be triggered when a user selects a new item or keyboard navigates
       * through the list items.
       */
      onBlur: _react.PropTypes.func,
  
      /**
       * The amount of time that a list of letters should be used when finding a menu item
       * while typing. Since a user can select items by typing multiple letters in a row,
       * this will be used as the timeout for clearing those letters.
       *
       * For example:
       * - User types `g`
       *
       * Full match is now `'g'`.
       *
       * - User delays 200ms and types `u`
       *
       * Full match is now `'gu'`
       *
       * - User delays 1000ms and types `a`.
       *
       * Full match is now `'a'`
       */
      keyboardMatchingTimeout: _react.PropTypes.number.isRequired,
  
      /**
       * Boolean if the select field's list of menu items should stretch to at least
       * be the width of the select field.
       */
      stretchList: _react.PropTypes.bool,
  
      /**
       * Boolean if there has been an error for the select field. This will display
       * the `errorText`. And style the floating label and focus indicator with the
       * error color.
       */
      error: _react.PropTypes.bool,
  
      /**
       * An optional error text to display when the `error` prop is true.
       */
      errorText: _react.PropTypes.node,
  
      /**
       * An optional help text to display below the select field.
       */
      helpText: _react.PropTypes.node,
  
      /**
       * Boolean if the help text should only be displayed when the select field
       * has focus.
       */
      helpOnFocus: _react.PropTypes.bool,
  
      /**
       * Boolean if the select field is required. This will updated the label or placeholder
       * to include an asterisk.
       */
      required: _react.PropTypes.bool,
  
      /**
       * Boolean if the select field is in a toolbar. This will automatically be injected if the select field
       * is passed in as the `menuTitle` prop.
       */
      toolbar: _react.PropTypes.bool,
  
      /**
       * Boolean if the menu surrounding the select field should be full width or not.
       */
      fullWidth: _react.PropTypes.bool,
  
      menuStyle: (0, _deprecated2.default)(_react.PropTypes.object, 'Use `style` instead'),
      menuClassName: (0, _deprecated2.default)(_react.PropTypes.string, 'Use `className` instead'),
      initiallyOpen: (0, _deprecated2.default)(_react.PropTypes.bool, 'Use `defaultOpen` instead'),
      floatingLabel: (0, _deprecated2.default)(_react.PropTypes.bool, 'A select field can only have floating labels now. Only provide the `label` prop'),
      noAutoAdjust: (0, _deprecated2.default)(_react.PropTypes.bool, 'No longer valid to use since select fields are no longer text fields'),
      adjustMinWidth: (0, _deprecated2.default)(_react.PropTypes.bool, 'No longer valid to use since select fields are no longer text fields')
    };
    SelectField.defaultProps = {
      defaultValue: '',
      itemLabel: 'label',
      itemValue: 'value',
      iconChildren: 'arrow_drop_down',
      position: SelectField.Positions.TOP_LEFT,
      lineDirection: 'left',
      keyboardMatchingTimeout: 1000,
      stretchList: true,
      menuItems: []
    };
    exports.default = SelectField;
  });