downshift 7.1.1 → 7.1.2

package/dist/downshift.umd.js

@@ -4,6 +4,55 @@
   (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.Downshift = {}, global.React));
 })(this, (function (exports, react) { 'use strict';
 
+  function _objectWithoutPropertiesLoose(source, excluded) {
+    if (source == null) return {};
+    var target = {};
+    var sourceKeys = Object.keys(source);
+    var key, i;
+    for (i = 0; i < sourceKeys.length; i++) {
+      key = sourceKeys[i];
+      if (excluded.indexOf(key) >= 0) continue;
+      target[key] = source[key];
+    }
+    return target;
+  }
+
+  function _extends() {
+    _extends = Object.assign ? Object.assign.bind() : 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;
+    };
+    return _extends.apply(this, arguments);
+  }
+
+  function _assertThisInitialized(self) {
+    if (self === void 0) {
+      throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
+    }
+    return self;
+  }
+
+  function _setPrototypeOf(o, p) {
+    _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) {
+      o.__proto__ = p;
+      return o;
+    };
+    return _setPrototypeOf(o, p);
+  }
+
+  function _inheritsLoose(subClass, superClass) {
+    subClass.prototype = Object.create(superClass.prototype);
+    subClass.prototype.constructor = subClass;
+    _setPrototypeOf(subClass, superClass);
+  }
+
   var propTypes$3 = {exports: {}};
 
   var reactIs$1 = {exports: {}};
@@ -1265,7 +1314,7 @@
 
   function t(t){return "object"==typeof t&&null!=t&&1===t.nodeType}function e(t,e){return (!e||"hidden"!==t)&&"visible"!==t&&"clip"!==t}function n(t,n){if(t.clientHeight<t.scrollHeight||t.clientWidth<t.scrollWidth){var r=getComputedStyle(t,null);return e(r.overflowY,n)||e(r.overflowX,n)||function(t){var e=function(t){if(!t.ownerDocument||!t.ownerDocument.defaultView)return null;try{return t.ownerDocument.defaultView.frameElement}catch(t){return null}}(t);return !!e&&(e.clientHeight<t.scrollHeight||e.clientWidth<t.scrollWidth)}(t)}return !1}function r(t,e,n,r,i,o,l,d){return o<t&&l>e||o>t&&l<e?0:o<=t&&d<=n||l>=e&&d>=n?o-t-r:l>e&&d<n||o<t&&d>n?l-e+i:0}var i=function(e,i){var o=window,l=i.scrollMode,d=i.block,f=i.inline,h=i.boundary,u=i.skipOverflowHiddenElements,s="function"==typeof h?h:function(t){return t!==h};if(!t(e))throw new TypeError("Invalid target");for(var a,c,g=document.scrollingElement||document.documentElement,p=[],m=e;t(m)&&s(m);){if((m=null==(c=(a=m).parentElement)?a.getRootNode().host||null:c)===g){p.push(m);break}null!=m&&m===document.body&&n(m)&&!n(document.documentElement)||null!=m&&n(m,u)&&p.push(m);}for(var w=o.visualViewport?o.visualViewport.width:innerWidth,v=o.visualViewport?o.visualViewport.height:innerHeight,W=window.scrollX||pageXOffset,H=window.scrollY||pageYOffset,b=e.getBoundingClientRect(),y=b.height,E=b.width,M=b.top,V=b.right,x=b.bottom,I=b.left,C="start"===d||"nearest"===d?M:"end"===d?x:M+y/2,R="center"===f?I+E/2:"end"===f?V:I,T=[],k=0;k<p.length;k++){var B=p[k],D=B.getBoundingClientRect(),O=D.height,X=D.width,Y=D.top,L=D.right,S=D.bottom,j=D.left;if("if-needed"===l&&M>=0&&I>=0&&x<=v&&V<=w&&M>=Y&&x<=S&&I>=j&&V<=L)return T;var N=getComputedStyle(B),q=parseInt(N.borderLeftWidth,10),z=parseInt(N.borderTopWidth,10),A=parseInt(N.borderRightWidth,10),F=parseInt(N.borderBottomWidth,10),G=0,J=0,K="offsetWidth"in B?B.offsetWidth-B.clientWidth-q-A:0,P="offsetHeight"in B?B.offsetHeight-B.clientHeight-z-F:0,Q="offsetWidth"in B?0===B.offsetWidth?0:X/B.offsetWidth:0,U="offsetHeight"in B?0===B.offsetHeight?0:O/B.offsetHeight:0;if(g===B)G="start"===d?C:"end"===d?C-v:"nearest"===d?r(H,H+v,v,z,F,H+C,H+C+y,y):C-v/2,J="start"===f?R:"center"===f?R-w/2:"end"===f?R-w:r(W,W+w,w,q,A,W+R,W+R+E,E),G=Math.max(0,G+H),J=Math.max(0,J+W);else {G="start"===d?C-Y-z:"end"===d?C-S+F+P:"nearest"===d?r(Y,S,O,z,F+P,C,C+y,y):C-(Y+O/2)+P/2,J="start"===f?R-j-q:"center"===f?R-(j+X/2)+K/2:"end"===f?R-L+A+K:r(j,L,X,q,A+K,R,R+E,E);var Z=B.scrollLeft,$=B.scrollTop;C+=$-(G=Math.max(0,Math.min($+G/U,B.scrollHeight-O/U+P))),R+=Z-(J=Math.max(0,Math.min(Z+J/Q,B.scrollWidth-X/Q+K)));}T.push({el:B,top:G,left:J});}return T};
 
-  let idCounter = 0;
+  var idCounter = 0;
 
   /**
    * Accepts a parameter and returns it if it's a function
@@ -1289,17 +1338,15 @@
     if (!node) {
       return;
     }
-    const actions = i(node, {
+    var actions = i(node, {
       boundary: menuNode,
       block: 'nearest',
       scrollMode: 'if-needed'
     });
-    actions.forEach(_ref => {
-      let {
-        el,
-        top,
-        left
-      } = _ref;
+    actions.forEach(function (_ref) {
+      var el = _ref.el,
+        top = _ref.top,
+        left = _ref.left;
       el.scrollTop = top;
       el.scrollLeft = left;
     });
@@ -1312,7 +1359,7 @@
    * @return {Boolean} whether the parent is the child or the child is in the parent
    */
   function isOrContainsNode(parent, child, environment) {
-    const result = parent === child || child instanceof environment.Node && parent.contains && parent.contains(child);
+    var result = parent === child || child instanceof environment.Node && parent.contains && parent.contains(child);
     return result;
   }
 
@@ -1325,7 +1372,7 @@
    * @return {Function} the debounced function
    */
   function debounce(fn, time) {
-    let timeoutId;
+    var timeoutId;
     function cancel() {
       if (timeoutId) {
         clearTimeout(timeoutId);
@@ -1336,9 +1383,9 @@
         args[_key] = arguments[_key];
       }
       cancel();
-      timeoutId = setTimeout(() => {
+      timeoutId = setTimeout(function () {
         timeoutId = null;
-        fn(...args);
+        fn.apply(void 0, args);
       }, time);
     }
     wrapper.cancel = cancel;
@@ -1360,9 +1407,9 @@
       for (var _len3 = arguments.length, args = new Array(_len3 > 1 ? _len3 - 1 : 0), _key3 = 1; _key3 < _len3; _key3++) {
         args[_key3 - 1] = arguments[_key3];
       }
-      return fns.some(fn => {
+      return fns.some(function (fn) {
         if (fn) {
-          fn(event, ...args);
+          fn.apply(void 0, [event].concat(args));
         }
         return event.preventDownshiftDefault || event.hasOwnProperty('nativeEvent') && event.nativeEvent.preventDownshiftDefault;
       });
@@ -1372,8 +1419,8 @@
     for (var _len4 = arguments.length, refs = new Array(_len4), _key4 = 0; _key4 < _len4; _key4++) {
       refs[_key4] = arguments[_key4];
     }
-    return node => {
-      refs.forEach(ref => {
+    return function (node) {
+      refs.forEach(function (ref) {
         if (typeof ref === 'function') {
           ref(node);
         } else if (ref) {
@@ -1407,11 +1454,9 @@
    * @return {String} the a11y status message
    */
   function getA11yStatusMessage$1(_ref2) {
-    let {
-      isOpen,
-      resultCount,
-      previousResultCount
-    } = _ref2;
+    var isOpen = _ref2.isOpen,
+      resultCount = _ref2.resultCount,
+      previousResultCount = _ref2.previousResultCount;
     if (!isOpen) {
       return '';
     }
@@ -1419,7 +1464,7 @@
       return 'No results are available.';
     }
     if (resultCount !== previousResultCount) {
-      return `${resultCount} result${resultCount === 1 ? ' is' : 's are'} available, use up and down arrow keys to navigate. Press Enter key to select.`;
+      return resultCount + " result" + (resultCount === 1 ? ' is' : 's are') + " available, use up and down arrow keys to navigate. Press Enter key to select.";
     }
     return '';
   }
@@ -1466,9 +1511,9 @@
    */
   function requiredProp(fnName, propName) {
     // eslint-disable-next-line no-console
-    console.error(`The property "${propName}" is required in "${fnName}"`);
+    console.error("The property \"" + propName + "\" is required in \"" + fnName + "\"");
   }
-  const stateKeys = ['highlightedIndex', 'inputValue', 'isOpen', 'selectedItem', 'type'];
+  var stateKeys = ['highlightedIndex', 'inputValue', 'isOpen', 'selectedItem', 'type'];
   /**
    * @param {Object} state the state object
    * @return {Object} state that is relevant to downshift
@@ -1477,8 +1522,8 @@
     if (state === void 0) {
       state = {};
     }
-    const result = {};
-    stateKeys.forEach(k => {
+    var result = {};
+    stateKeys.forEach(function (k) {
       if (state.hasOwnProperty(k)) {
         result[k] = state[k];
       }
@@ -1498,7 +1543,7 @@
    * @returns {Object} The merged controlled state.
    */
   function getState(state, props) {
-    return Object.keys(state).reduce((prevState, key) => {
+    return Object.keys(state).reduce(function (prevState, key) {
       prevState[key] = isControlledProp(props, key) ? props[key] : state[key];
       return prevState;
     }, {});
@@ -1523,13 +1568,11 @@
    * @return {String} keyboard key
    */
   function normalizeArrowKey(event) {
-    const {
-      key,
-      keyCode
-    } = event;
+    var key = event.key,
+      keyCode = event.keyCode;
     /* istanbul ignore next (ie) */
     if (keyCode >= 37 && keyCode <= 40 && key.indexOf('Arrow') !== 0) {
-      return `Arrow${key}`;
+      return "Arrow" + key;
     }
     return key;
   }
@@ -1561,17 +1604,17 @@
     if (itemCount === 0) {
       return -1;
     }
-    const itemsLastIndex = itemCount - 1;
+    var itemsLastIndex = itemCount - 1;
     if (typeof baseIndex !== 'number' || baseIndex < 0 || baseIndex >= itemCount) {
       baseIndex = moveAmount > 0 ? -1 : itemsLastIndex + 1;
     }
-    let newIndex = baseIndex + moveAmount;
+    var newIndex = baseIndex + moveAmount;
     if (newIndex < 0) {
       newIndex = circular ? itemsLastIndex : 0;
     } else if (newIndex > itemsLastIndex) {
       newIndex = circular ? 0 : itemsLastIndex;
     }
-    const nonDisabledNewIndex = getNextNonDisabledIndex(moveAmount, newIndex, itemCount, getItemNodeFromIndex, circular);
+    var nonDisabledNewIndex = getNextNonDisabledIndex(moveAmount, newIndex, itemCount, getItemNodeFromIndex, circular);
     if (nonDisabledNewIndex === -1) {
       return baseIndex >= itemCount ? -1 : baseIndex;
     }
@@ -1589,20 +1632,20 @@
    * @returns {number} The new index. Returns baseIndex if item is not disabled. Returns next non-disabled item otherwise. If no non-disabled found it will return -1.
    */
   function getNextNonDisabledIndex(moveAmount, baseIndex, itemCount, getItemNodeFromIndex, circular) {
-    const currentElementNode = getItemNodeFromIndex(baseIndex);
+    var currentElementNode = getItemNodeFromIndex(baseIndex);
     if (!currentElementNode || !currentElementNode.hasAttribute('disabled')) {
       return baseIndex;
     }
     if (moveAmount > 0) {
-      for (let index = baseIndex + 1; index < itemCount; index++) {
+      for (var index = baseIndex + 1; index < itemCount; index++) {
         if (!getItemNodeFromIndex(index).hasAttribute('disabled')) {
           return index;
         }
       }
     } else {
-      for (let index = baseIndex - 1; index >= 0; index--) {
-        if (!getItemNodeFromIndex(index).hasAttribute('disabled')) {
-          return index;
+      for (var _index = baseIndex - 1; _index >= 0; _index--) {
+        if (!getItemNodeFromIndex(_index).hasAttribute('disabled')) {
+          return _index;
         }
       }
     }
@@ -1626,28 +1669,30 @@
     if (checkActiveElement === void 0) {
       checkActiveElement = true;
     }
-    return downshiftElements.some(contextNode => contextNode && (isOrContainsNode(contextNode, target, environment) || checkActiveElement && isOrContainsNode(contextNode, environment.document.activeElement, environment)));
+    return downshiftElements.some(function (contextNode) {
+      return contextNode && (isOrContainsNode(contextNode, target, environment) || checkActiveElement && isOrContainsNode(contextNode, environment.document.activeElement, environment));
+    });
   }
 
   // eslint-disable-next-line import/no-mutable-exports
-  let validateControlledUnchanged = noop;
+  var validateControlledUnchanged = noop;
   /* istanbul ignore next */
   {
-    validateControlledUnchanged = (state, prevProps, nextProps) => {
-      const warningDescription = `This prop should not switch from controlled to uncontrolled (or vice versa). Decide between using a controlled or uncontrolled Downshift element for the lifetime of the component. More info: https://github.com/downshift-js/downshift#control-props`;
-      Object.keys(state).forEach(propKey => {
+    validateControlledUnchanged = function validateControlledUnchanged(state, prevProps, nextProps) {
+      var warningDescription = "This prop should not switch from controlled to uncontrolled (or vice versa). Decide between using a controlled or uncontrolled Downshift element for the lifetime of the component. More info: https://github.com/downshift-js/downshift#control-props";
+      Object.keys(state).forEach(function (propKey) {
         if (prevProps[propKey] !== undefined && nextProps[propKey] === undefined) {
           // eslint-disable-next-line no-console
-          console.error(`downshift: A component has changed the controlled prop "${propKey}" to be uncontrolled. ${warningDescription}`);
+          console.error("downshift: A component has changed the controlled prop \"" + propKey + "\" to be uncontrolled. " + warningDescription);
         } else if (prevProps[propKey] === undefined && nextProps[propKey] !== undefined) {
           // eslint-disable-next-line no-console
-          console.error(`downshift: A component has changed the uncontrolled prop "${propKey}" to be controlled. ${warningDescription}`);
+          console.error("downshift: A component has changed the uncontrolled prop \"" + propKey + "\" to be controlled. " + warningDescription);
         }
       });
     };
   }
 
-  const cleanupStatus = debounce(documentProp => {
+  var cleanupStatus = debounce(function (documentProp) {
     getStatusDiv(documentProp).textContent = '';
   }, 500);
 
@@ -1656,7 +1701,7 @@
    * @param {Object} documentProp document passed by the user.
    */
   function setStatus(status, documentProp) {
-    const div = getStatusDiv(documentProp);
+    var div = getStatusDiv(documentProp);
     if (!status) {
       return;
     }
@@ -1673,7 +1718,7 @@
     if (documentProp === void 0) {
       documentProp = document;
     }
-    let statusDiv = documentProp.getElementById('a11y-status-message');
+    var statusDiv = documentProp.getElementById('a11y-status-message');
     if (statusDiv) {
       return statusDiv;
     }
@@ -1696,23 +1741,23 @@
     return statusDiv;
   }
 
-  const unknown = '__autocomplete_unknown__' ;
-  const mouseUp = '__autocomplete_mouseup__' ;
-  const itemMouseEnter = '__autocomplete_item_mouseenter__' ;
-  const keyDownArrowUp = '__autocomplete_keydown_arrow_up__' ;
-  const keyDownArrowDown = '__autocomplete_keydown_arrow_down__' ;
-  const keyDownEscape = '__autocomplete_keydown_escape__' ;
-  const keyDownEnter = '__autocomplete_keydown_enter__' ;
-  const keyDownHome = '__autocomplete_keydown_home__' ;
-  const keyDownEnd = '__autocomplete_keydown_end__' ;
-  const clickItem = '__autocomplete_click_item__' ;
-  const blurInput = '__autocomplete_blur_input__' ;
-  const changeInput = '__autocomplete_change_input__' ;
-  const keyDownSpaceButton = '__autocomplete_keydown_space_button__' ;
-  const clickButton = '__autocomplete_click_button__' ;
-  const blurButton = '__autocomplete_blur_button__' ;
-  const controlledPropUpdatedSelectedItem = '__autocomplete_controlled_prop_updated_selected_item__' ;
-  const touchEnd = '__autocomplete_touchend__' ;
+  var unknown = '__autocomplete_unknown__' ;
+  var mouseUp = '__autocomplete_mouseup__' ;
+  var itemMouseEnter = '__autocomplete_item_mouseenter__' ;
+  var keyDownArrowUp = '__autocomplete_keydown_arrow_up__' ;
+  var keyDownArrowDown = '__autocomplete_keydown_arrow_down__' ;
+  var keyDownEscape = '__autocomplete_keydown_escape__' ;
+  var keyDownEnter = '__autocomplete_keydown_enter__' ;
+  var keyDownHome = '__autocomplete_keydown_home__' ;
+  var keyDownEnd = '__autocomplete_keydown_end__' ;
+  var clickItem = '__autocomplete_click_item__' ;
+  var blurInput = '__autocomplete_blur_input__' ;
+  var changeInput = '__autocomplete_change_input__' ;
+  var keyDownSpaceButton = '__autocomplete_keydown_space_button__' ;
+  var clickButton = '__autocomplete_click_button__' ;
+  var blurButton = '__autocomplete_blur_button__' ;
+  var controlledPropUpdatedSelectedItem = '__autocomplete_controlled_prop_updated_selected_item__' ;
+  var touchEnd = '__autocomplete_touchend__' ;
 
   var stateChangeTypes$3 = /*#__PURE__*/Object.freeze({
     __proto__: null,
@@ -1735,37 +1780,48 @@
     touchEnd: touchEnd
   });
 
-  /* eslint camelcase:0 */
-  const Downshift = /*#__PURE__*/(() => {
-    class Downshift extends react.Component {
-      constructor(_props) {
+  var _excluded$4 = ["refKey", "ref"],
+    _excluded2$3 = ["onClick", "onPress", "onKeyDown", "onKeyUp", "onBlur"],
+    _excluded3$2 = ["onKeyDown", "onBlur", "onChange", "onInput", "onChangeText"],
+    _excluded4$1 = ["refKey", "ref"],
+    _excluded5 = ["onMouseMove", "onMouseDown", "onClick", "onPress", "index", "item"];
+  var Downshift = /*#__PURE__*/function () {
+    var Downshift = /*#__PURE__*/function (_Component) {
+      _inheritsLoose(Downshift, _Component);
+      function Downshift(_props) {
         var _this;
-        super(_props);
-        _this = this;
-        this.id = this.props.id || `downshift-${generateId()}`;
-        this.menuId = this.props.menuId || `${this.id}-menu`;
-        this.labelId = this.props.labelId || `${this.id}-label`;
-        this.inputId = this.props.inputId || `${this.id}-input`;
-        this.getItemId = this.props.getItemId || (index => `${this.id}-item-${index}`);
-        this.input = null;
-        this.items = [];
-        this.itemCount = null;
-        this.previousResultCount = 0;
-        this.timeoutIds = [];
-        this.internalSetTimeout = (fn, time) => {
-          const id = setTimeout(() => {
-            this.timeoutIds = this.timeoutIds.filter(i => i !== id);
+        _this = _Component.call(this, _props) || this;
+        // fancy destructuring + defaults + aliases
+        // this basically says each value of state should either be set to
+        // the initial value or the default value if the initial value is not provided
+        _this.id = _this.props.id || "downshift-" + generateId();
+        _this.menuId = _this.props.menuId || _this.id + "-menu";
+        _this.labelId = _this.props.labelId || _this.id + "-label";
+        _this.inputId = _this.props.inputId || _this.id + "-input";
+        _this.getItemId = _this.props.getItemId || function (index) {
+          return _this.id + "-item-" + index;
+        };
+        _this.input = null;
+        _this.items = [];
+        _this.itemCount = null;
+        _this.previousResultCount = 0;
+        _this.timeoutIds = [];
+        _this.internalSetTimeout = function (fn, time) {
+          var id = setTimeout(function () {
+            _this.timeoutIds = _this.timeoutIds.filter(function (i) {
+              return i !== id;
+            });
             fn();
           }, time);
-          this.timeoutIds.push(id);
+          _this.timeoutIds.push(id);
         };
-        this.setItemCount = count => {
-          this.itemCount = count;
+        _this.setItemCount = function (count) {
+          _this.itemCount = count;
         };
-        this.unsetItemCount = () => {
-          this.itemCount = null;
+        _this.unsetItemCount = function () {
+          _this.itemCount = null;
         };
-        this.setHighlightedIndex = function (highlightedIndex, otherStateToSet) {
+        _this.setHighlightedIndex = function (highlightedIndex, otherStateToSet) {
           if (highlightedIndex === void 0) {
             highlightedIndex = _this.props.defaultHighlightedIndex;
           }
@@ -1773,43 +1829,41 @@
             otherStateToSet = {};
           }
           otherStateToSet = pickState(otherStateToSet);
-          _this.internalSetState({
-            highlightedIndex,
-            ...otherStateToSet
-          });
+          _this.internalSetState(_extends({
+            highlightedIndex: highlightedIndex
+          }, otherStateToSet));
         };
-        this.clearSelection = cb => {
-          this.internalSetState({
+        _this.clearSelection = function (cb) {
+          _this.internalSetState({
             selectedItem: null,
             inputValue: '',
-            highlightedIndex: this.props.defaultHighlightedIndex,
-            isOpen: this.props.defaultIsOpen
+            highlightedIndex: _this.props.defaultHighlightedIndex,
+            isOpen: _this.props.defaultIsOpen
           }, cb);
         };
-        this.selectItem = (item, otherStateToSet, cb) => {
+        _this.selectItem = function (item, otherStateToSet, cb) {
           otherStateToSet = pickState(otherStateToSet);
-          this.internalSetState({
-            isOpen: this.props.defaultIsOpen,
-            highlightedIndex: this.props.defaultHighlightedIndex,
+          _this.internalSetState(_extends({
+            isOpen: _this.props.defaultIsOpen,
+            highlightedIndex: _this.props.defaultHighlightedIndex,
             selectedItem: item,
-            inputValue: this.props.itemToString(item),
-            ...otherStateToSet
-          }, cb);
+            inputValue: _this.props.itemToString(item)
+          }, otherStateToSet), cb);
         };
-        this.selectItemAtIndex = (itemIndex, otherStateToSet, cb) => {
-          const item = this.items[itemIndex];
+        _this.selectItemAtIndex = function (itemIndex, otherStateToSet, cb) {
+          var item = _this.items[itemIndex];
           if (item == null) {
             return;
           }
-          this.selectItem(item, otherStateToSet, cb);
+          _this.selectItem(item, otherStateToSet, cb);
         };
-        this.selectHighlightedItem = (otherStateToSet, cb) => {
-          return this.selectItemAtIndex(this.getState().highlightedIndex, otherStateToSet, cb);
+        _this.selectHighlightedItem = function (otherStateToSet, cb) {
+          return _this.selectItemAtIndex(_this.getState().highlightedIndex, otherStateToSet, cb);
         };
-        this.internalSetState = (stateToSet, cb) => {
-          let isItemSelected, onChangeArg;
-          const onStateChangeArg = {};
-          const isStateToSetFunction = typeof stateToSet === 'function';
+        _this.internalSetState = function (stateToSet, cb) {
+          var isItemSelected, onChangeArg;
+          var onStateChangeArg = {};
+          var isStateToSetFunction = typeof stateToSet === 'function';
 
           // we want to call `onInputValueChange` before the `setState` call
           // so someone controlling the `inputValue` state gets notified of
@@ -1817,24 +1871,21 @@
           // preserving the cursor position.
           // See https://github.com/downshift-js/downshift/issues/217 for more info.
           if (!isStateToSetFunction && stateToSet.hasOwnProperty('inputValue')) {
-            this.props.onInputValueChange(stateToSet.inputValue, {
-              ...this.getStateAndHelpers(),
-              ...stateToSet
-            });
+            _this.props.onInputValueChange(stateToSet.inputValue, _extends({}, _this.getStateAndHelpers(), stateToSet));
           }
-          return this.setState(state => {
-            state = this.getState(state);
-            let newStateToSet = isStateToSetFunction ? stateToSet(state) : stateToSet;
+          return _this.setState(function (state) {
+            state = _this.getState(state);
+            var newStateToSet = isStateToSetFunction ? stateToSet(state) : stateToSet;
 
             // Your own function that could modify the state that will be set.
-            newStateToSet = this.props.stateReducer(state, newStateToSet);
+            newStateToSet = _this.props.stateReducer(state, newStateToSet);
 
             // checks if an item is selected, regardless of if it's different from
             // what was selected before
             // used to determine if onSelect and onChange callbacks should be called
             isItemSelected = newStateToSet.hasOwnProperty('selectedItem');
             // this keeps track of the object we want to call with setState
-            const nextState = {};
+            var nextState = {};
             // we need to call on change if the outside world is controlling any of our state
             // and we're trying to update that state. OR if the selection has changed and we're
             // trying to update the selection
@@ -1842,7 +1893,7 @@
               onChangeArg = newStateToSet.selectedItem;
             }
             newStateToSet.type = newStateToSet.type || unknown;
-            Object.keys(newStateToSet).forEach(key => {
+            Object.keys(newStateToSet).forEach(function (key) {
               // onStateChangeArg should only have the state that is
               // actually changing
               if (state[key] !== newStateToSet[key]) {
@@ -1859,7 +1910,7 @@
               }
               newStateToSet[key];
               // if it's coming from props, then we don't care to set it internally
-              if (!isControlledProp(this.props, key)) {
+              if (!isControlledProp(_this.props, key)) {
                 nextState[key] = newStateToSet[key];
               }
             });
@@ -1867,66 +1918,58 @@
             // if stateToSet is a function, then we weren't able to call onInputValueChange
             // earlier, so we'll call it now that we know what the inputValue state will be.
             if (isStateToSetFunction && newStateToSet.hasOwnProperty('inputValue')) {
-              this.props.onInputValueChange(newStateToSet.inputValue, {
-                ...this.getStateAndHelpers(),
-                ...newStateToSet
-              });
+              _this.props.onInputValueChange(newStateToSet.inputValue, _extends({}, _this.getStateAndHelpers(), newStateToSet));
             }
             return nextState;
-          }, () => {
+          }, function () {
             // call the provided callback if it's a function
             cbToCb(cb)();
 
             // only call the onStateChange and onChange callbacks if
             // we have relevant information to pass them.
-            const hasMoreStateThanType = Object.keys(onStateChangeArg).length > 1;
+            var hasMoreStateThanType = Object.keys(onStateChangeArg).length > 1;
             if (hasMoreStateThanType) {
-              this.props.onStateChange(onStateChangeArg, this.getStateAndHelpers());
+              _this.props.onStateChange(onStateChangeArg, _this.getStateAndHelpers());
             }
             if (isItemSelected) {
-              this.props.onSelect(stateToSet.selectedItem, this.getStateAndHelpers());
+              _this.props.onSelect(stateToSet.selectedItem, _this.getStateAndHelpers());
             }
             if (onChangeArg !== undefined) {
-              this.props.onChange(onChangeArg, this.getStateAndHelpers());
+              _this.props.onChange(onChangeArg, _this.getStateAndHelpers());
             }
             // this is currently undocumented and therefore subject to change
             // We'll try to not break it, but just be warned.
-            this.props.onUserAction(onStateChangeArg, this.getStateAndHelpers());
+            _this.props.onUserAction(onStateChangeArg, _this.getStateAndHelpers());
           });
         };
-        this.rootRef = node => this._rootNode = node;
-        this.getRootProps = function (_temp, _temp2) {
-          let {
-            refKey = 'ref',
-            ref,
-            ...rest
-          } = _temp === void 0 ? {} : _temp;
-          let {
-            suppressRefError = false
-          } = _temp2 === void 0 ? {} : _temp2;
+        _this.rootRef = function (node) {
+          return _this._rootNode = node;
+        };
+        _this.getRootProps = function (_temp, _temp2) {
+          var _extends2;
+          var _ref = _temp === void 0 ? {} : _temp,
+            _ref$refKey = _ref.refKey,
+            refKey = _ref$refKey === void 0 ? 'ref' : _ref$refKey,
+            ref = _ref.ref,
+            rest = _objectWithoutPropertiesLoose(_ref, _excluded$4);
+          var _ref2 = _temp2 === void 0 ? {} : _temp2,
+            _ref2$suppressRefErro = _ref2.suppressRefError,
+            suppressRefError = _ref2$suppressRefErro === void 0 ? false : _ref2$suppressRefErro;
           // this is used in the render to know whether the user has called getRootProps.
           // It uses that to know whether to apply the props automatically
           _this.getRootProps.called = true;
           _this.getRootProps.refKey = refKey;
           _this.getRootProps.suppressRefError = suppressRefError;
-          const {
-            isOpen
-          } = _this.getState();
-          return {
-            [refKey]: handleRefs(ref, _this.rootRef),
-            role: 'combobox',
-            'aria-expanded': isOpen,
-            'aria-haspopup': 'listbox',
-            'aria-owns': isOpen ? _this.menuId : null,
-            'aria-labelledby': _this.labelId,
-            ...rest
-          };
+          var _this$getState = _this.getState(),
+            isOpen = _this$getState.isOpen;
+          return _extends((_extends2 = {}, _extends2[refKey] = handleRefs(ref, _this.rootRef), _extends2.role = 'combobox', _extends2['aria-expanded'] = isOpen, _extends2['aria-haspopup'] = 'listbox', _extends2['aria-owns'] = isOpen ? _this.menuId : null, _extends2['aria-labelledby'] = _this.labelId, _extends2), rest);
         };
-        this.keyDownHandlers = {
-          ArrowDown(event) {
+        _this.keyDownHandlers = {
+          ArrowDown: function ArrowDown(event) {
+            var _this2 = this;
             event.preventDefault();
             if (this.getState().isOpen) {
-              const amount = event.shiftKey ? 5 : 1;
+              var amount = event.shiftKey ? 5 : 1;
               this.moveHighlightedIndex(amount, {
                 type: keyDownArrowDown
               });
@@ -1934,24 +1977,26 @@
               this.internalSetState({
                 isOpen: true,
                 type: keyDownArrowDown
-              }, () => {
-                const itemCount = this.getItemCount();
+              }, function () {
+                var itemCount = _this2.getItemCount();
                 if (itemCount > 0) {
-                  const {
-                    highlightedIndex
-                  } = this.getState();
-                  const nextHighlightedIndex = getNextWrappingIndex(1, highlightedIndex, itemCount, index => this.getItemNodeFromIndex(index));
-                  this.setHighlightedIndex(nextHighlightedIndex, {
+                  var _this2$getState = _this2.getState(),
+                    highlightedIndex = _this2$getState.highlightedIndex;
+                  var nextHighlightedIndex = getNextWrappingIndex(1, highlightedIndex, itemCount, function (index) {
+                    return _this2.getItemNodeFromIndex(index);
+                  });
+                  _this2.setHighlightedIndex(nextHighlightedIndex, {
                     type: keyDownArrowDown
                   });
                 }
               });
             }
           },
-          ArrowUp(event) {
+          ArrowUp: function ArrowUp(event) {
+            var _this3 = this;
             event.preventDefault();
             if (this.getState().isOpen) {
-              const amount = event.shiftKey ? -5 : -1;
+              var amount = event.shiftKey ? -5 : -1;
               this.moveHighlightedIndex(amount, {
                 type: keyDownArrowUp
               });
@@ -1959,32 +2004,32 @@
               this.internalSetState({
                 isOpen: true,
                 type: keyDownArrowUp
-              }, () => {
-                const itemCount = this.getItemCount();
+              }, function () {
+                var itemCount = _this3.getItemCount();
                 if (itemCount > 0) {
-                  const {
-                    highlightedIndex
-                  } = this.getState();
-                  const nextHighlightedIndex = getNextWrappingIndex(-1, highlightedIndex, itemCount, index => this.getItemNodeFromIndex(index));
-                  this.setHighlightedIndex(nextHighlightedIndex, {
+                  var _this3$getState = _this3.getState(),
+                    highlightedIndex = _this3$getState.highlightedIndex;
+                  var nextHighlightedIndex = getNextWrappingIndex(-1, highlightedIndex, itemCount, function (index) {
+                    return _this3.getItemNodeFromIndex(index);
+                  });
+                  _this3.setHighlightedIndex(nextHighlightedIndex, {
                     type: keyDownArrowUp
                   });
                 }
               });
             }
           },
-          Enter(event) {
+          Enter: function Enter(event) {
             if (event.which === 229) {
               return;
             }
-            const {
-              isOpen,
-              highlightedIndex
-            } = this.getState();
+            var _this$getState2 = this.getState(),
+              isOpen = _this$getState2.isOpen,
+              highlightedIndex = _this$getState2.highlightedIndex;
             if (isOpen && highlightedIndex != null) {
               event.preventDefault();
-              const item = this.items[highlightedIndex];
-              const itemNode = this.getItemNodeFromIndex(highlightedIndex);
+              var item = this.items[highlightedIndex];
+              var itemNode = this.getItemNodeFromIndex(highlightedIndex);
               if (item == null || itemNode && itemNode.hasAttribute('disabled')) {
                 return;
               }
@@ -1993,112 +2038,109 @@
               });
             }
           },
-          Escape(event) {
+          Escape: function Escape(event) {
             event.preventDefault();
-            this.reset({
-              type: keyDownEscape,
-              ...(!this.state.isOpen && {
-                selectedItem: null,
-                inputValue: ''
-              })
-            });
+            this.reset(_extends({
+              type: keyDownEscape
+            }, !this.state.isOpen && {
+              selectedItem: null,
+              inputValue: ''
+            }));
           }
         };
-        this.buttonKeyDownHandlers = {
-          ...this.keyDownHandlers,
-          ' '(event) {
+        _this.buttonKeyDownHandlers = _extends({}, _this.keyDownHandlers, {
+          ' ': function _(event) {
             event.preventDefault();
             this.toggleMenu({
               type: keyDownSpaceButton
             });
           }
-        };
-        this.inputKeyDownHandlers = {
-          ...this.keyDownHandlers,
-          Home(event) {
-            const {
-              isOpen
-            } = this.getState();
+        });
+        _this.inputKeyDownHandlers = _extends({}, _this.keyDownHandlers, {
+          Home: function Home(event) {
+            var _this4 = this;
+            var _this$getState3 = this.getState(),
+              isOpen = _this$getState3.isOpen;
             if (!isOpen) {
               return;
             }
             event.preventDefault();
-            const itemCount = this.getItemCount();
+            var itemCount = this.getItemCount();
             if (itemCount <= 0 || !isOpen) {
               return;
             }
 
             // get next non-disabled starting downwards from 0 if that's disabled.
-            const newHighlightedIndex = getNextNonDisabledIndex(1, 0, itemCount, index => this.getItemNodeFromIndex(index), false);
+            var newHighlightedIndex = getNextNonDisabledIndex(1, 0, itemCount, function (index) {
+              return _this4.getItemNodeFromIndex(index);
+            }, false);
             this.setHighlightedIndex(newHighlightedIndex, {
               type: keyDownHome
             });
           },
-          End(event) {
-            const {
-              isOpen
-            } = this.getState();
+          End: function End(event) {
+            var _this5 = this;
+            var _this$getState4 = this.getState(),
+              isOpen = _this$getState4.isOpen;
             if (!isOpen) {
               return;
             }
             event.preventDefault();
-            const itemCount = this.getItemCount();
+            var itemCount = this.getItemCount();
             if (itemCount <= 0 || !isOpen) {
               return;
             }
 
             // get next non-disabled starting upwards from last index if that's disabled.
-            const newHighlightedIndex = getNextNonDisabledIndex(-1, itemCount - 1, itemCount, index => this.getItemNodeFromIndex(index), false);
+            var newHighlightedIndex = getNextNonDisabledIndex(-1, itemCount - 1, itemCount, function (index) {
+              return _this5.getItemNodeFromIndex(index);
+            }, false);
             this.setHighlightedIndex(newHighlightedIndex, {
               type: keyDownEnd
             });
           }
-        };
-        this.getToggleButtonProps = function (_temp3) {
-          let {
-            onClick,
-            onPress,
-            onKeyDown,
-            onKeyUp,
-            onBlur,
-            ...rest
-          } = _temp3 === void 0 ? {} : _temp3;
-          const {
-            isOpen
-          } = _this.getState();
-          const enabledEventHandlers = {
+        });
+        _this.getToggleButtonProps = function (_temp3) {
+          var _ref3 = _temp3 === void 0 ? {} : _temp3,
+            onClick = _ref3.onClick;
+            _ref3.onPress;
+            var onKeyDown = _ref3.onKeyDown,
+            onKeyUp = _ref3.onKeyUp,
+            onBlur = _ref3.onBlur,
+            rest = _objectWithoutPropertiesLoose(_ref3, _excluded2$3);
+          var _this$getState5 = _this.getState(),
+            isOpen = _this$getState5.isOpen;
+          var enabledEventHandlers = {
             onClick: callAllEventHandlers(onClick, _this.buttonHandleClick),
             onKeyDown: callAllEventHandlers(onKeyDown, _this.buttonHandleKeyDown),
             onKeyUp: callAllEventHandlers(onKeyUp, _this.buttonHandleKeyUp),
             onBlur: callAllEventHandlers(onBlur, _this.buttonHandleBlur)
           };
-          const eventHandlers = rest.disabled ? {} : enabledEventHandlers;
-          return {
+          var eventHandlers = rest.disabled ? {} : enabledEventHandlers;
+          return _extends({
             type: 'button',
             role: 'button',
             'aria-label': isOpen ? 'close menu' : 'open menu',
             'aria-haspopup': true,
-            'data-toggle': true,
-            ...eventHandlers,
-            ...rest
-          };
+            'data-toggle': true
+          }, eventHandlers, rest);
         };
-        this.buttonHandleKeyUp = event => {
+        _this.buttonHandleKeyUp = function (event) {
           // Prevent click event from emitting in Firefox
           event.preventDefault();
         };
-        this.buttonHandleKeyDown = event => {
-          const key = normalizeArrowKey(event);
-          if (this.buttonKeyDownHandlers[key]) {
-            this.buttonKeyDownHandlers[key].call(this, event);
+        _this.buttonHandleKeyDown = function (event) {
+          var key = normalizeArrowKey(event);
+          if (_this.buttonKeyDownHandlers[key]) {
+            _this.buttonKeyDownHandlers[key].call(_assertThisInitialized(_this), event);
           }
         };
-        this.buttonHandleClick = event => {
+        _this.buttonHandleClick = function (event) {
           event.preventDefault();
           // handle odd case for Safari and Firefox which
           // don't give the button the focus properly.
           /* istanbul ignore if (can't reasonably test this) */
-          if (this.props.environment.document.activeElement === this.props.environment.document.body) {
+          if (_this.props.environment.document.activeElement === _this.props.environment.document.body) {
             event.target.focus();
           }
           // to simplify testing components that use downshift, we'll not wrap this in a setTimeout
@@ -2106,59 +2148,55 @@
           // when building for production and should therefore have no impact on production code.
           {
             // Ensure that toggle of menu occurs after the potential blur event in iOS
-            this.internalSetTimeout(() => this.toggleMenu({
-              type: clickButton
-            }));
+            _this.internalSetTimeout(function () {
+              return _this.toggleMenu({
+                type: clickButton
+              });
+            });
           }
         };
-        this.buttonHandleBlur = event => {
-          const blurTarget = event.target; // Save blur target for comparison with activeElement later
+        _this.buttonHandleBlur = function (event) {
+          var blurTarget = event.target; // Save blur target for comparison with activeElement later
           // Need setTimeout, so that when the user presses Tab, the activeElement is the next focused element, not body element
-          this.internalSetTimeout(() => {
-            if (!this.isMouseDown && (this.props.environment.document.activeElement == null || this.props.environment.document.activeElement.id !== this.inputId) && this.props.environment.document.activeElement !== blurTarget // Do nothing if we refocus the same element again (to solve issue in Safari on iOS)
+          _this.internalSetTimeout(function () {
+            if (!_this.isMouseDown && (_this.props.environment.document.activeElement == null || _this.props.environment.document.activeElement.id !== _this.inputId) && _this.props.environment.document.activeElement !== blurTarget // Do nothing if we refocus the same element again (to solve issue in Safari on iOS)
             ) {
-              this.reset({
+              _this.reset({
                 type: blurButton
               });
             }
           });
         };
-        this.getLabelProps = props => {
-          return {
-            htmlFor: this.inputId,
-            id: this.labelId,
-            ...props
-          };
+        _this.getLabelProps = function (props) {
+          return _extends({
+            htmlFor: _this.inputId,
+            id: _this.labelId
+          }, props);
         };
-        this.getInputProps = function (_temp4) {
-          let {
-            onKeyDown,
-            onBlur,
-            onChange,
-            onInput,
-            onChangeText,
-            ...rest
-          } = _temp4 === void 0 ? {} : _temp4;
-          let onChangeKey;
-          let eventHandlers = {};
+        _this.getInputProps = function (_temp4) {
+          var _ref4 = _temp4 === void 0 ? {} : _temp4,
+            onKeyDown = _ref4.onKeyDown,
+            onBlur = _ref4.onBlur,
+            onChange = _ref4.onChange,
+            onInput = _ref4.onInput;
+            _ref4.onChangeText;
+            var rest = _objectWithoutPropertiesLoose(_ref4, _excluded3$2);
+          var onChangeKey;
+          var eventHandlers = {};
 
           /* istanbul ignore next (preact) */
           {
             onChangeKey = 'onChange';
           }
-          const {
-            inputValue,
-            isOpen,
-            highlightedIndex
-          } = _this.getState();
+          var _this$getState6 = _this.getState(),
+            inputValue = _this$getState6.inputValue,
+            isOpen = _this$getState6.isOpen,
+            highlightedIndex = _this$getState6.highlightedIndex;
           if (!rest.disabled) {
-            eventHandlers = {
-              [onChangeKey]: callAllEventHandlers(onChange, onInput, _this.inputHandleChange),
-              onKeyDown: callAllEventHandlers(onKeyDown, _this.inputHandleKeyDown),
-              onBlur: callAllEventHandlers(onBlur, _this.inputHandleBlur)
-            };
+            var _eventHandlers;
+            eventHandlers = (_eventHandlers = {}, _eventHandlers[onChangeKey] = callAllEventHandlers(onChange, onInput, _this.inputHandleChange), _eventHandlers.onKeyDown = callAllEventHandlers(onKeyDown, _this.inputHandleKeyDown), _eventHandlers.onBlur = callAllEventHandlers(onBlur, _this.inputHandleBlur), _eventHandlers);
           }
-          return {
+          return _extends({
             'aria-autocomplete': 'list',
             'aria-activedescendant': isOpen && typeof highlightedIndex === 'number' && highlightedIndex >= 0 ? _this.getItemId(highlightedIndex) : null,
             'aria-controls': isOpen ? _this.menuId : null,
@@ -2167,82 +2205,76 @@
             // revert back since autocomplete="nope" is ignored on latest Chrome and Opera
             autoComplete: 'off',
             value: inputValue,
-            id: _this.inputId,
-            ...eventHandlers,
-            ...rest
-          };
+            id: _this.inputId
+          }, eventHandlers, rest);
         };
-        this.inputHandleKeyDown = event => {
-          const key = normalizeArrowKey(event);
-          if (key && this.inputKeyDownHandlers[key]) {
-            this.inputKeyDownHandlers[key].call(this, event);
+        _this.inputHandleKeyDown = function (event) {
+          var key = normalizeArrowKey(event);
+          if (key && _this.inputKeyDownHandlers[key]) {
+            _this.inputKeyDownHandlers[key].call(_assertThisInitialized(_this), event);
           }
         };
-        this.inputHandleChange = event => {
-          this.internalSetState({
+        _this.inputHandleChange = function (event) {
+          _this.internalSetState({
             type: changeInput,
             isOpen: true,
             inputValue: event.target.value,
-            highlightedIndex: this.props.defaultHighlightedIndex
+            highlightedIndex: _this.props.defaultHighlightedIndex
           });
         };
-        this.inputHandleBlur = () => {
+        _this.inputHandleBlur = function () {
           // Need setTimeout, so that when the user presses Tab, the activeElement is the next focused element, not the body element
-          this.internalSetTimeout(() => {
-            const downshiftButtonIsActive = this.props.environment.document && !!this.props.environment.document.activeElement && !!this.props.environment.document.activeElement.dataset && this.props.environment.document.activeElement.dataset.toggle && this._rootNode && this._rootNode.contains(this.props.environment.document.activeElement);
-            if (!this.isMouseDown && !downshiftButtonIsActive) {
-              this.reset({
+          _this.internalSetTimeout(function () {
+            var downshiftButtonIsActive = _this.props.environment.document && !!_this.props.environment.document.activeElement && !!_this.props.environment.document.activeElement.dataset && _this.props.environment.document.activeElement.dataset.toggle && _this._rootNode && _this._rootNode.contains(_this.props.environment.document.activeElement);
+            if (!_this.isMouseDown && !downshiftButtonIsActive) {
+              _this.reset({
                 type: blurInput
               });
             }
           });
         };
-        this.menuRef = node => {
-          this._menuNode = node;
+        _this.menuRef = function (node) {
+          _this._menuNode = node;
         };
-        this.getMenuProps = function (_temp5, _temp6) {
-          let {
-            refKey = 'ref',
-            ref,
-            ...props
-          } = _temp5 === void 0 ? {} : _temp5;
-          let {
-            suppressRefError = false
-          } = _temp6 === void 0 ? {} : _temp6;
+        _this.getMenuProps = function (_temp5, _temp6) {
+          var _extends3;
+          var _ref5 = _temp5 === void 0 ? {} : _temp5,
+            _ref5$refKey = _ref5.refKey,
+            refKey = _ref5$refKey === void 0 ? 'ref' : _ref5$refKey,
+            ref = _ref5.ref,
+            props = _objectWithoutPropertiesLoose(_ref5, _excluded4$1);
+          var _ref6 = _temp6 === void 0 ? {} : _temp6,
+            _ref6$suppressRefErro = _ref6.suppressRefError,
+            suppressRefError = _ref6$suppressRefErro === void 0 ? false : _ref6$suppressRefErro;
           _this.getMenuProps.called = true;
           _this.getMenuProps.refKey = refKey;
           _this.getMenuProps.suppressRefError = suppressRefError;
-          return {
-            [refKey]: handleRefs(ref, _this.menuRef),
-            role: 'listbox',
-            'aria-labelledby': props && props['aria-label'] ? null : _this.labelId,
-            id: _this.menuId,
-            ...props
-          };
+          return _extends((_extends3 = {}, _extends3[refKey] = handleRefs(ref, _this.menuRef), _extends3.role = 'listbox', _extends3['aria-labelledby'] = props && props['aria-label'] ? null : _this.labelId, _extends3.id = _this.menuId, _extends3), props);
         };
-        this.getItemProps = function (_temp7) {
-          let {
-            onMouseMove,
-            onMouseDown,
-            onClick,
-            onPress,
-            index,
-            item = requiredProp('getItemProps', 'item'),
-            ...rest
-          } = _temp7 === void 0 ? {} : _temp7;
+        _this.getItemProps = function (_temp7) {
+          var _enabledEventHandlers;
+          var _ref7 = _temp7 === void 0 ? {} : _temp7,
+            onMouseMove = _ref7.onMouseMove,
+            onMouseDown = _ref7.onMouseDown,
+            onClick = _ref7.onClick;
+            _ref7.onPress;
+            var index = _ref7.index,
+            _ref7$item = _ref7.item,
+            item = _ref7$item === void 0 ? requiredProp('getItemProps', 'item') : _ref7$item,
+            rest = _objectWithoutPropertiesLoose(_ref7, _excluded5);
           if (index === undefined) {
             _this.items.push(item);
             index = _this.items.indexOf(item);
           } else {
             _this.items[index] = item;
           }
-          const onSelectKey = 'onClick';
-          const customClickHandler = onClick;
-          const enabledEventHandlers = {
+          var onSelectKey = 'onClick';
+          var customClickHandler = onClick;
+          var enabledEventHandlers = (_enabledEventHandlers = {
             // onMouseMove is used over onMouseEnter here. onMouseMove
             // is only triggered on actual mouse movement while onMouseEnter
             // can fire on DOM changes, interrupting keyboard navigation
-            onMouseMove: callAllEventHandlers(onMouseMove, () => {
+            onMouseMove: callAllEventHandlers(onMouseMove, function () {
               if (index === _this.getState().highlightedIndex) {
                 return;
               }
@@ -2255,75 +2287,66 @@
               // from under the user which is currently scrolling/moving the
               // cursor
               _this.avoidScrolling = true;
-              _this.internalSetTimeout(() => _this.avoidScrolling = false, 250);
+              _this.internalSetTimeout(function () {
+                return _this.avoidScrolling = false;
+              }, 250);
             }),
-            onMouseDown: callAllEventHandlers(onMouseDown, event => {
+            onMouseDown: callAllEventHandlers(onMouseDown, function (event) {
               // This prevents the activeElement from being changed
               // to the item so it can remain with the current activeElement
               // which is a more common use case.
               event.preventDefault();
-            }),
-            [onSelectKey]: callAllEventHandlers(customClickHandler, () => {
-              _this.selectItemAtIndex(index, {
-                type: clickItem
-              });
             })
-          };
+          }, _enabledEventHandlers[onSelectKey] = callAllEventHandlers(customClickHandler, function () {
+            _this.selectItemAtIndex(index, {
+              type: clickItem
+            });
+          }), _enabledEventHandlers);
 
           // Passing down the onMouseDown handler to prevent redirect
           // of the activeElement if clicking on disabled items
-          const eventHandlers = rest.disabled ? {
+          var eventHandlers = rest.disabled ? {
             onMouseDown: enabledEventHandlers.onMouseDown
           } : enabledEventHandlers;
-          return {
+          return _extends({
             id: _this.getItemId(index),
             role: 'option',
-            'aria-selected': _this.getState().highlightedIndex === index,
-            ...eventHandlers,
-            ...rest
-          };
+            'aria-selected': _this.getState().highlightedIndex === index
+          }, eventHandlers, rest);
         };
-        this.clearItems = () => {
-          this.items = [];
+        _this.clearItems = function () {
+          _this.items = [];
         };
-        this.reset = function (otherStateToSet, cb) {
+        _this.reset = function (otherStateToSet, cb) {
           if (otherStateToSet === void 0) {
             otherStateToSet = {};
           }
           otherStateToSet = pickState(otherStateToSet);
-          _this.internalSetState(_ref => {
-            let {
-              selectedItem
-            } = _ref;
-            return {
+          _this.internalSetState(function (_ref8) {
+            var selectedItem = _ref8.selectedItem;
+            return _extends({
               isOpen: _this.props.defaultIsOpen,
               highlightedIndex: _this.props.defaultHighlightedIndex,
-              inputValue: _this.props.itemToString(selectedItem),
-              ...otherStateToSet
-            };
+              inputValue: _this.props.itemToString(selectedItem)
+            }, otherStateToSet);
           }, cb);
         };
-        this.toggleMenu = function (otherStateToSet, cb) {
+        _this.toggleMenu = function (otherStateToSet, cb) {
           if (otherStateToSet === void 0) {
             otherStateToSet = {};
           }
           otherStateToSet = pickState(otherStateToSet);
-          _this.internalSetState(_ref2 => {
-            let {
-              isOpen
-            } = _ref2;
-            return {
-              isOpen: !isOpen,
-              ...(isOpen && {
-                highlightedIndex: _this.props.defaultHighlightedIndex
-              }),
-              ...otherStateToSet
-            };
-          }, () => {
-            const {
-              isOpen,
-              highlightedIndex
-            } = _this.getState();
+          _this.internalSetState(function (_ref9) {
+            var isOpen = _ref9.isOpen;
+            return _extends({
+              isOpen: !isOpen
+            }, isOpen && {
+              highlightedIndex: _this.props.defaultHighlightedIndex
+            }, otherStateToSet);
+          }, function () {
+            var _this$getState7 = _this.getState(),
+              isOpen = _this$getState7.isOpen,
+              highlightedIndex = _this$getState7.highlightedIndex;
             if (isOpen) {
               if (_this.getItemCount() > 0 && typeof highlightedIndex === 'number') {
                 _this.setHighlightedIndex(highlightedIndex, otherStateToSet);
@@ -2332,57 +2355,58 @@
             cbToCb(cb)();
           });
         };
-        this.openMenu = cb => {
-          this.internalSetState({
+        _this.openMenu = function (cb) {
+          _this.internalSetState({
             isOpen: true
           }, cb);
         };
-        this.closeMenu = cb => {
-          this.internalSetState({
+        _this.closeMenu = function (cb) {
+          _this.internalSetState({
             isOpen: false
           }, cb);
         };
-        this.updateStatus = debounce(() => {
-          const state = this.getState();
-          const item = this.items[state.highlightedIndex];
-          const resultCount = this.getItemCount();
-          const status = this.props.getA11yStatusMessage({
-            itemToString: this.props.itemToString,
-            previousResultCount: this.previousResultCount,
-            resultCount,
-            highlightedItem: item,
-            ...state
-          });
-          this.previousResultCount = resultCount;
-          setStatus(status, this.props.environment.document);
+        _this.updateStatus = debounce(function () {
+          var state = _this.getState();
+          var item = _this.items[state.highlightedIndex];
+          var resultCount = _this.getItemCount();
+          var status = _this.props.getA11yStatusMessage(_extends({
+            itemToString: _this.props.itemToString,
+            previousResultCount: _this.previousResultCount,
+            resultCount: resultCount,
+            highlightedItem: item
+          }, state));
+          _this.previousResultCount = resultCount;
+          setStatus(status, _this.props.environment.document);
         }, 200);
-        // fancy destructuring + defaults + aliases
-        // this basically says each value of state should either be set to
-        // the initial value or the default value if the initial value is not provided
-        const {
-          defaultHighlightedIndex,
-          initialHighlightedIndex: _highlightedIndex = defaultHighlightedIndex,
-          defaultIsOpen,
-          initialIsOpen: _isOpen = defaultIsOpen,
-          initialInputValue: _inputValue = '',
-          initialSelectedItem: _selectedItem = null
-        } = this.props;
-        const _state = this.getState({
+        var _this$props = _this.props,
+          defaultHighlightedIndex = _this$props.defaultHighlightedIndex,
+          _this$props$initialHi = _this$props.initialHighlightedIndex,
+          _highlightedIndex = _this$props$initialHi === void 0 ? defaultHighlightedIndex : _this$props$initialHi,
+          defaultIsOpen = _this$props.defaultIsOpen,
+          _this$props$initialIs = _this$props.initialIsOpen,
+          _isOpen = _this$props$initialIs === void 0 ? defaultIsOpen : _this$props$initialIs,
+          _this$props$initialIn = _this$props.initialInputValue,
+          _inputValue = _this$props$initialIn === void 0 ? '' : _this$props$initialIn,
+          _this$props$initialSe = _this$props.initialSelectedItem,
+          _selectedItem = _this$props$initialSe === void 0 ? null : _this$props$initialSe;
+        var _state = _this.getState({
           highlightedIndex: _highlightedIndex,
           isOpen: _isOpen,
           inputValue: _inputValue,
           selectedItem: _selectedItem
         });
-        if (_state.selectedItem != null && this.props.initialInputValue === undefined) {
-          _state.inputValue = this.props.itemToString(_state.selectedItem);
+        if (_state.selectedItem != null && _this.props.initialInputValue === undefined) {
+          _state.inputValue = _this.props.itemToString(_state.selectedItem);
         }
-        this.state = _state;
+        _this.state = _state;
+        return _this;
       }
+      var _proto = Downshift.prototype;
       /**
        * Clear all running timeouts
        */
-      internalClearTimeouts() {
-        this.timeoutIds.forEach(id => {
+      _proto.internalClearTimeouts = function internalClearTimeouts() {
+        this.timeoutIds.forEach(function (id) {
           clearTimeout(id);
         });
         this.timeoutIds = [];
@@ -2396,117 +2420,113 @@
        *
        * @param {Object} stateToMerge defaults to this.state
        * @return {Object} the state
-       */
-      getState(stateToMerge) {
+       */;
+      _proto.getState = function getState$1(stateToMerge) {
         if (stateToMerge === void 0) {
           stateToMerge = this.state;
         }
         return getState(stateToMerge, this.props);
-      }
-      getItemCount() {
+      };
+      _proto.getItemCount = function getItemCount() {
         // things read better this way. They're in priority order:
         // 1. `this.itemCount`
         // 2. `this.props.itemCount`
         // 3. `this.items.length`
-        let itemCount = this.items.length;
+        var itemCount = this.items.length;
         if (this.itemCount != null) {
           itemCount = this.itemCount;
         } else if (this.props.itemCount !== undefined) {
           itemCount = this.props.itemCount;
         }
         return itemCount;
-      }
-      getItemNodeFromIndex(index) {
+      };
+      _proto.getItemNodeFromIndex = function getItemNodeFromIndex(index) {
         return this.props.environment.document.getElementById(this.getItemId(index));
-      }
-      scrollHighlightedItemIntoView() {
+      };
+      _proto.scrollHighlightedItemIntoView = function scrollHighlightedItemIntoView() {
         /* istanbul ignore else (react-native) */
         {
-          const node = this.getItemNodeFromIndex(this.getState().highlightedIndex);
+          var node = this.getItemNodeFromIndex(this.getState().highlightedIndex);
           this.props.scrollIntoView(node, this._menuNode);
         }
-      }
-      moveHighlightedIndex(amount, otherStateToSet) {
-        const itemCount = this.getItemCount();
-        const {
-          highlightedIndex
-        } = this.getState();
+      };
+      _proto.moveHighlightedIndex = function moveHighlightedIndex(amount, otherStateToSet) {
+        var _this6 = this;
+        var itemCount = this.getItemCount();
+        var _this$getState8 = this.getState(),
+          highlightedIndex = _this$getState8.highlightedIndex;
         if (itemCount > 0) {
-          const nextHighlightedIndex = getNextWrappingIndex(amount, highlightedIndex, itemCount, index => this.getItemNodeFromIndex(index));
+          var nextHighlightedIndex = getNextWrappingIndex(amount, highlightedIndex, itemCount, function (index) {
+            return _this6.getItemNodeFromIndex(index);
+          });
           this.setHighlightedIndex(nextHighlightedIndex, otherStateToSet);
         }
-      }
-      getStateAndHelpers() {
-        const {
-          highlightedIndex,
-          inputValue,
-          selectedItem,
-          isOpen
-        } = this.getState();
-        const {
-          itemToString
-        } = this.props;
-        const {
-          id
-        } = this;
-        const {
-          getRootProps,
-          getToggleButtonProps,
-          getLabelProps,
-          getMenuProps,
-          getInputProps,
-          getItemProps,
-          openMenu,
-          closeMenu,
-          toggleMenu,
-          selectItem,
-          selectItemAtIndex,
-          selectHighlightedItem,
-          setHighlightedIndex,
-          clearSelection,
-          clearItems,
-          reset,
-          setItemCount,
-          unsetItemCount,
-          internalSetState: setState
-        } = this;
+      };
+      _proto.getStateAndHelpers = function getStateAndHelpers() {
+        var _this$getState9 = this.getState(),
+          highlightedIndex = _this$getState9.highlightedIndex,
+          inputValue = _this$getState9.inputValue,
+          selectedItem = _this$getState9.selectedItem,
+          isOpen = _this$getState9.isOpen;
+        var itemToString = this.props.itemToString;
+        var id = this.id;
+        var getRootProps = this.getRootProps,
+          getToggleButtonProps = this.getToggleButtonProps,
+          getLabelProps = this.getLabelProps,
+          getMenuProps = this.getMenuProps,
+          getInputProps = this.getInputProps,
+          getItemProps = this.getItemProps,
+          openMenu = this.openMenu,
+          closeMenu = this.closeMenu,
+          toggleMenu = this.toggleMenu,
+          selectItem = this.selectItem,
+          selectItemAtIndex = this.selectItemAtIndex,
+          selectHighlightedItem = this.selectHighlightedItem,
+          setHighlightedIndex = this.setHighlightedIndex,
+          clearSelection = this.clearSelection,
+          clearItems = this.clearItems,
+          reset = this.reset,
+          setItemCount = this.setItemCount,
+          unsetItemCount = this.unsetItemCount,
+          setState = this.internalSetState;
         return {
           // prop getters
-          getRootProps,
-          getToggleButtonProps,
-          getLabelProps,
-          getMenuProps,
-          getInputProps,
-          getItemProps,
+          getRootProps: getRootProps,
+          getToggleButtonProps: getToggleButtonProps,
+          getLabelProps: getLabelProps,
+          getMenuProps: getMenuProps,
+          getInputProps: getInputProps,
+          getItemProps: getItemProps,
           // actions
-          reset,
-          openMenu,
-          closeMenu,
-          toggleMenu,
-          selectItem,
-          selectItemAtIndex,
-          selectHighlightedItem,
-          setHighlightedIndex,
-          clearSelection,
-          clearItems,
-          setItemCount,
-          unsetItemCount,
-          setState,
+          reset: reset,
+          openMenu: openMenu,
+          closeMenu: closeMenu,
+          toggleMenu: toggleMenu,
+          selectItem: selectItem,
+          selectItemAtIndex: selectItemAtIndex,
+          selectHighlightedItem: selectHighlightedItem,
+          setHighlightedIndex: setHighlightedIndex,
+          clearSelection: clearSelection,
+          clearItems: clearItems,
+          setItemCount: setItemCount,
+          unsetItemCount: unsetItemCount,
+          setState: setState,
           // props
-          itemToString,
+          itemToString: itemToString,
           // derived
-          id,
+          id: id,
           // state
-          highlightedIndex,
-          inputValue,
-          isOpen,
-          selectedItem
+          highlightedIndex: highlightedIndex,
+          inputValue: inputValue,
+          isOpen: isOpen,
+          selectedItem: selectedItem
         };
       }
 
       //////////////////////////// ROOT
-
-      componentDidMount() {
+      ;
+      _proto.componentDidMount = function componentDidMount() {
+        var _this7 = this;
         /* istanbul ignore if (react-native) */
         if (this.getMenuProps.called && !this.getMenuProps.suppressRefError) {
           validateGetMenuPropsCalledCorrectly(this._menuNode, this.getMenuProps);
@@ -2519,18 +2539,20 @@
           // down long enough for the list to disappear (because the blur event fires on the input)
           // this.isMouseDown is used in the blur handler on the input to determine whether the blur event should
           // trigger hiding the menu.
-          const onMouseDown = () => {
-            this.isMouseDown = true;
+          var onMouseDown = function onMouseDown() {
+            _this7.isMouseDown = true;
           };
-          const onMouseUp = event => {
-            this.isMouseDown = false;
+          var onMouseUp = function onMouseUp(event) {
+            _this7.isMouseDown = false;
             // if the target element or the activeElement is within a downshift node
             // then we don't want to reset downshift
-            const contextWithinDownshift = targetWithinDownshift(event.target, [this._rootNode, this._menuNode], this.props.environment);
-            if (!contextWithinDownshift && this.getState().isOpen) {
-              this.reset({
+            var contextWithinDownshift = targetWithinDownshift(event.target, [_this7._rootNode, _this7._menuNode], _this7.props.environment);
+            if (!contextWithinDownshift && _this7.getState().isOpen) {
+              _this7.reset({
                 type: mouseUp
-              }, () => this.props.onOuterClick(this.getStateAndHelpers()));
+              }, function () {
+                return _this7.props.onOuterClick(_this7.getStateAndHelpers());
+              });
             }
           };
           // Touching an element in iOS gives focus and hover states, but touching out of
@@ -2539,31 +2561,31 @@
           // this.isTouchMove helps us track whether the user is tapping or swiping on a touch screen.
           // If the user taps outside of Downshift, the component should be reset,
           // but not if the user is swiping
-          const onTouchStart = () => {
-            this.isTouchMove = false;
+          var onTouchStart = function onTouchStart() {
+            _this7.isTouchMove = false;
           };
-          const onTouchMove = () => {
-            this.isTouchMove = true;
+          var onTouchMove = function onTouchMove() {
+            _this7.isTouchMove = true;
           };
-          const onTouchEnd = event => {
-            const contextWithinDownshift = targetWithinDownshift(event.target, [this._rootNode, this._menuNode], this.props.environment, false);
-            if (!this.isTouchMove && !contextWithinDownshift && this.getState().isOpen) {
-              this.reset({
+          var onTouchEnd = function onTouchEnd(event) {
+            var contextWithinDownshift = targetWithinDownshift(event.target, [_this7._rootNode, _this7._menuNode], _this7.props.environment, false);
+            if (!_this7.isTouchMove && !contextWithinDownshift && _this7.getState().isOpen) {
+              _this7.reset({
                 type: touchEnd
-              }, () => this.props.onOuterClick(this.getStateAndHelpers()));
+              }, function () {
+                return _this7.props.onOuterClick(_this7.getStateAndHelpers());
+              });
             }
           };
-          const {
-            environment
-          } = this.props;
+          var environment = this.props.environment;
           environment.addEventListener('mousedown', onMouseDown);
           environment.addEventListener('mouseup', onMouseUp);
           environment.addEventListener('touchstart', onTouchStart);
           environment.addEventListener('touchmove', onTouchMove);
           environment.addEventListener('touchend', onTouchEnd);
-          this.cleanup = () => {
-            this.internalClearTimeouts();
-            this.updateStatus.cancel();
+          this.cleanup = function () {
+            _this7.internalClearTimeouts();
+            _this7.updateStatus.cancel();
             environment.removeEventListener('mousedown', onMouseDown);
             environment.removeEventListener('mouseup', onMouseUp);
             environment.removeEventListener('touchstart', onTouchStart);
@@ -2571,19 +2593,17 @@
             environment.removeEventListener('touchend', onTouchEnd);
           };
         }
-      }
-      shouldScroll(prevState, prevProps) {
-        const {
-          highlightedIndex: currentHighlightedIndex
-        } = this.props.highlightedIndex === undefined ? this.getState() : this.props;
-        const {
-          highlightedIndex: prevHighlightedIndex
-        } = prevProps.highlightedIndex === undefined ? prevState : prevProps;
-        const scrollWhenOpen = currentHighlightedIndex && this.getState().isOpen && !prevState.isOpen;
-        const scrollWhenNavigating = currentHighlightedIndex !== prevHighlightedIndex;
+      };
+      _proto.shouldScroll = function shouldScroll(prevState, prevProps) {
+        var _ref10 = this.props.highlightedIndex === undefined ? this.getState() : this.props,
+          currentHighlightedIndex = _ref10.highlightedIndex;
+        var _ref11 = prevProps.highlightedIndex === undefined ? prevState : prevProps,
+          prevHighlightedIndex = _ref11.highlightedIndex;
+        var scrollWhenOpen = currentHighlightedIndex && this.getState().isOpen && !prevState.isOpen;
+        var scrollWhenNavigating = currentHighlightedIndex !== prevHighlightedIndex;
         return scrollWhenOpen || scrollWhenNavigating;
-      }
-      componentDidUpdate(prevProps, prevState) {
+      };
+      _proto.componentDidUpdate = function componentDidUpdate(prevProps, prevState) {
         {
           validateControlledUnchanged(this.state, prevProps, this.props);
           /* istanbul ignore if (react-native) */
@@ -2605,13 +2625,12 @@
         {
           this.updateStatus();
         }
-      }
-      componentWillUnmount() {
+      };
+      _proto.componentWillUnmount = function componentWillUnmount() {
         this.cleanup(); // avoids memory leak
-      }
-
-      render() {
-        const children = unwrapArray(this.props.children, noop);
+      };
+      _proto.render = function render() {
+        var children = unwrapArray(this.props.children, noop);
         // because the items are rerendered every time we call the children
         // we clear this out each render and it will be populated again as
         // getItemProps is called.
@@ -2631,7 +2650,7 @@
         this.getLabelProps.called = false;
         // and something similar for getInputProps
         this.getInputProps.called = false;
-        const element = unwrapArray(children(this.getStateAndHelpers()));
+        var element = unwrapArray(children(this.getStateAndHelpers()));
         if (!element) {
           return null;
         }
@@ -2653,13 +2672,14 @@
 
           throw new Error('downshift: If you return a non-DOM element, you must apply the getRootProps function');
         }
-      }
-    }
+      };
+      return Downshift;
+    }(react.Component);
     Downshift.defaultProps = {
       defaultHighlightedIndex: null,
       defaultIsOpen: false,
       getA11yStatusMessage: getA11yStatusMessage$1,
-      itemToString: i => {
+      itemToString: function itemToString(i) {
         if (i == null) {
           return '';
         }
@@ -2675,16 +2695,20 @@
       onChange: noop,
       onSelect: noop,
       onOuterClick: noop,
-      selectedItemChanged: (prevItem, item) => prevItem !== item,
+      selectedItemChanged: function selectedItemChanged(prevItem, item) {
+        return prevItem !== item;
+      },
       environment: /* istanbul ignore next (ssr) */
       typeof window === 'undefined' ? {} : window,
-      stateReducer: (state, stateToSet) => stateToSet,
+      stateReducer: function stateReducer(state, stateToSet) {
+        return stateToSet;
+      },
       suppressRefError: false,
-      scrollIntoView
+      scrollIntoView: scrollIntoView
     };
     Downshift.stateChangeTypes = stateChangeTypes$3;
     return Downshift;
-  })();
+  }();
   Downshift.propTypes = {
     children: PropTypes.func,
     defaultHighlightedIndex: PropTypes.number,
@@ -2730,70 +2754,61 @@
     /* eslint-enable react/no-unused-prop-types */
   } ;
   var Downshift$1 = Downshift;
-  function validateGetMenuPropsCalledCorrectly(node, _ref3) {
-    let {
-      refKey
-    } = _ref3;
+  function validateGetMenuPropsCalledCorrectly(node, _ref12) {
+    var refKey = _ref12.refKey;
     if (!node) {
       // eslint-disable-next-line no-console
-      console.error(`downshift: The ref prop "${refKey}" from getMenuProps was not applied correctly on your menu element.`);
+      console.error("downshift: The ref prop \"" + refKey + "\" from getMenuProps was not applied correctly on your menu element.");
     }
   }
-  function validateGetRootPropsCalledCorrectly(element, _ref4) {
-    let {
-      refKey
-    } = _ref4;
-    const refKeySpecified = refKey !== 'ref';
-    const isComposite = !isDOMElement(element);
+  function validateGetRootPropsCalledCorrectly(element, _ref13) {
+    var refKey = _ref13.refKey;
+    var refKeySpecified = refKey !== 'ref';
+    var isComposite = !isDOMElement(element);
     if (isComposite && !refKeySpecified && !reactIs.exports.isForwardRef(element)) {
       // eslint-disable-next-line no-console
       console.error('downshift: You returned a non-DOM element. You must specify a refKey in getRootProps');
     } else if (!isComposite && refKeySpecified) {
       // eslint-disable-next-line no-console
-      console.error(`downshift: You returned a DOM element. You should not specify a refKey in getRootProps. You specified "${refKey}"`);
+      console.error("downshift: You returned a DOM element. You should not specify a refKey in getRootProps. You specified \"" + refKey + "\"");
     }
     if (!reactIs.exports.isForwardRef(element) && !getElementProps(element)[refKey]) {
       // eslint-disable-next-line no-console
-      console.error(`downshift: You must apply the ref prop "${refKey}" from getRootProps onto your root element.`);
+      console.error("downshift: You must apply the ref prop \"" + refKey + "\" from getRootProps onto your root element.");
     }
   }
 
-  const dropdownDefaultStateValues = {
+  var _excluded$3 = ["isInitialMount", "highlightedIndex", "items", "environment"];
+  var dropdownDefaultStateValues = {
     highlightedIndex: -1,
     isOpen: false,
     selectedItem: null,
     inputValue: ''
   };
   function callOnChangeProps(action, state, newState) {
-    const {
-      props,
-      type
-    } = action;
-    const changes = {};
-    Object.keys(state).forEach(key => {
+    var props = action.props,
+      type = action.type;
+    var changes = {};
+    Object.keys(state).forEach(function (key) {
       invokeOnChangeHandler(key, action, state, newState);
       if (newState[key] !== state[key]) {
         changes[key] = newState[key];
       }
     });
     if (props.onStateChange && Object.keys(changes).length) {
-      props.onStateChange({
-        type,
-        ...changes
-      });
+      props.onStateChange(_extends({
+        type: type
+      }, changes));
     }
   }
   function invokeOnChangeHandler(key, action, state, newState) {
-    const {
-      props,
-      type
-    } = action;
-    const handler = `on${capitalizeString(key)}Change`;
+    var props = action.props,
+      type = action.type;
+    var handler = "on" + capitalizeString(key) + "Change";
     if (props[handler] && newState[key] !== undefined && newState[key] !== state[key]) {
-      props[handler]({
-        type,
-        ...newState
-      });
+      props[handler](_extends({
+        type: type
+      }, newState));
     }
   }
 
@@ -2815,37 +2830,36 @@
    * @returns {string} The a11y message.
    */
   function getA11ySelectionMessage(selectionParameters) {
-    const {
-      selectedItem,
-      itemToString: itemToStringLocal
-    } = selectionParameters;
-    return selectedItem ? `${itemToStringLocal(selectedItem)} has been selected.` : '';
+    var selectedItem = selectionParameters.selectedItem,
+      itemToStringLocal = selectionParameters.itemToString;
+    return selectedItem ? itemToStringLocal(selectedItem) + " has been selected." : '';
   }
 
   /**
    * Debounced call for updating the a11y message.
    */
-  const updateA11yStatus = debounce((getA11yMessage, document) => {
+  var updateA11yStatus = debounce(function (getA11yMessage, document) {
     setStatus(getA11yMessage(), document);
   }, 200);
 
   // istanbul ignore next
-  const useIsomorphicLayoutEffect = typeof window !== 'undefined' && typeof window.document !== 'undefined' && typeof window.document.createElement !== 'undefined' ? react.useLayoutEffect : react.useEffect;
+  var useIsomorphicLayoutEffect = typeof window !== 'undefined' && typeof window.document !== 'undefined' && typeof window.document.createElement !== 'undefined' ? react.useLayoutEffect : react.useEffect;
   function useElementIds(_ref) {
-    let {
-      id = `downshift-${generateId()}`,
-      labelId,
-      menuId,
-      getItemId,
-      toggleButtonId,
-      inputId
-    } = _ref;
-    const elementIdsRef = react.useRef({
-      labelId: labelId || `${id}-label`,
-      menuId: menuId || `${id}-menu`,
-      getItemId: getItemId || (index => `${id}-item-${index}`),
-      toggleButtonId: toggleButtonId || `${id}-toggle-button`,
-      inputId: inputId || `${id}-input`
+    var _ref$id = _ref.id,
+      id = _ref$id === void 0 ? "downshift-" + generateId() : _ref$id,
+      labelId = _ref.labelId,
+      menuId = _ref.menuId,
+      getItemId = _ref.getItemId,
+      toggleButtonId = _ref.toggleButtonId,
+      inputId = _ref.inputId;
+    var elementIdsRef = react.useRef({
+      labelId: labelId || id + "-label",
+      menuId: menuId || id + "-menu",
+      getItemId: getItemId || function (index) {
+        return id + "-item-" + index;
+      },
+      toggleButtonId: toggleButtonId || id + "-toggle-button",
+      inputId: inputId || id + "-input"
     });
     return elementIdsRef.current;
   }
@@ -2865,10 +2879,10 @@
     return /^\S{1}$/.test(key);
   }
   function capitalizeString(string) {
-    return `${string.slice(0, 1).toUpperCase()}${string.slice(1)}`;
+    return "" + string.slice(0, 1).toUpperCase() + string.slice(1);
   }
   function useLatestRef(val) {
-    const ref = react.useRef(val);
+    var ref = react.useRef(val);
     // technically this is not "concurrent mode safe" because we're manipulating
     // the value during render (so it's not idempotent). However, the places this
     // hook is used is to support memoizing callbacks which will be called
@@ -2889,26 +2903,28 @@
    * @returns {Array} An array with the state and an action dispatcher.
    */
   function useEnhancedReducer(reducer, initialState, props) {
-    const prevStateRef = react.useRef();
-    const actionRef = react.useRef();
-    const enhancedReducer = react.useCallback((state, action) => {
+    var prevStateRef = react.useRef();
+    var actionRef = react.useRef();
+    var enhancedReducer = react.useCallback(function (state, action) {
       actionRef.current = action;
       state = getState(state, action.props);
-      const changes = reducer(state, action);
-      const newState = action.props.stateReducer(state, {
-        ...action,
-        changes
-      });
+      var changes = reducer(state, action);
+      var newState = action.props.stateReducer(state, _extends({}, action, {
+        changes: changes
+      }));
       return newState;
     }, [reducer]);
-    const [state, dispatch] = react.useReducer(enhancedReducer, initialState);
-    const propsRef = useLatestRef(props);
-    const dispatchWithProps = react.useCallback(action => dispatch({
-      props: propsRef.current,
-      ...action
-    }), [propsRef]);
-    const action = actionRef.current;
-    react.useEffect(() => {
+    var _useReducer = react.useReducer(enhancedReducer, initialState),
+      state = _useReducer[0],
+      dispatch = _useReducer[1];
+    var propsRef = useLatestRef(props);
+    var dispatchWithProps = react.useCallback(function (action) {
+      return dispatch(_extends({
+        props: propsRef.current
+      }, action));
+    }, [propsRef]);
+    var action = actionRef.current;
+    react.useEffect(function () {
       if (action && prevStateRef.current && prevStateRef.current !== state) {
         callOnChangeProps(action, getState(prevStateRef.current, action.props), state);
       }
@@ -2927,14 +2943,16 @@
    * @returns {Array} An array with the state and an action dispatcher.
    */
   function useControlledReducer$1(reducer, initialState, props) {
-    const [state, dispatch] = useEnhancedReducer(reducer, initialState, props);
+    var _useEnhancedReducer = useEnhancedReducer(reducer, initialState, props),
+      state = _useEnhancedReducer[0],
+      dispatch = _useEnhancedReducer[1];
     return [getState(state, props), dispatch];
   }
-  const defaultProps$3 = {
-    itemToString,
-    stateReducer,
-    getA11ySelectionMessage,
-    scrollIntoView,
+  var defaultProps$3 = {
+    itemToString: itemToString,
+    stateReducer: stateReducer,
+    getA11ySelectionMessage: getA11ySelectionMessage,
+    scrollIntoView: scrollIntoView,
     environment: /* istanbul ignore next (ssr) */
     typeof window === 'undefined' ? {} : window
   };
@@ -2942,7 +2960,7 @@
     if (defaultStateValues === void 0) {
       defaultStateValues = dropdownDefaultStateValues;
     }
-    const defaultValue = props[`default${capitalizeString(propKey)}`];
+    var defaultValue = props["default" + capitalizeString(propKey)];
     if (defaultValue !== undefined) {
       return defaultValue;
     }
@@ -2952,38 +2970,34 @@
     if (defaultStateValues === void 0) {
       defaultStateValues = dropdownDefaultStateValues;
     }
-    const value = props[propKey];
+    var value = props[propKey];
     if (value !== undefined) {
       return value;
     }
-    const initialValue = props[`initial${capitalizeString(propKey)}`];
+    var initialValue = props["initial" + capitalizeString(propKey)];
     if (initialValue !== undefined) {
       return initialValue;
     }
     return getDefaultValue$1(props, propKey, defaultStateValues);
   }
   function getInitialState$2(props) {
-    const selectedItem = getInitialValue$1(props, 'selectedItem');
-    const isOpen = getInitialValue$1(props, 'isOpen');
-    const highlightedIndex = getInitialValue$1(props, 'highlightedIndex');
-    const inputValue = getInitialValue$1(props, 'inputValue');
+    var selectedItem = getInitialValue$1(props, 'selectedItem');
+    var isOpen = getInitialValue$1(props, 'isOpen');
+    var highlightedIndex = getInitialValue$1(props, 'highlightedIndex');
+    var inputValue = getInitialValue$1(props, 'inputValue');
     return {
       highlightedIndex: highlightedIndex < 0 && selectedItem && isOpen ? props.items.indexOf(selectedItem) : highlightedIndex,
-      isOpen,
-      selectedItem,
-      inputValue
+      isOpen: isOpen,
+      selectedItem: selectedItem,
+      inputValue: inputValue
     };
   }
   function getHighlightedIndexOnOpen(props, state, offset) {
-    const {
-      items,
-      initialHighlightedIndex,
-      defaultHighlightedIndex
-    } = props;
-    const {
-      selectedItem,
-      highlightedIndex
-    } = state;
+    var items = props.items,
+      initialHighlightedIndex = props.initialHighlightedIndex,
+      defaultHighlightedIndex = props.defaultHighlightedIndex;
+    var selectedItem = state.selectedItem,
+      highlightedIndex = state.highlightedIndex;
     if (items.length === 0) {
       return -1;
     }
@@ -3014,30 +3028,34 @@
    * @returns {Object} Ref containing whether mouseDown or touchMove event is happening
    */
   function useMouseAndTouchTracker(isOpen, downshiftElementRefs, environment, handleBlur) {
-    const mouseAndTouchTrackersRef = react.useRef({
+    var mouseAndTouchTrackersRef = react.useRef({
       isMouseDown: false,
       isTouchMove: false
     });
-    react.useEffect(() => {
+    react.useEffect(function () {
       // The same strategy for checking if a click occurred inside or outside downsift
       // as in downshift.js.
-      const onMouseDown = () => {
+      var onMouseDown = function onMouseDown() {
         mouseAndTouchTrackersRef.current.isMouseDown = true;
       };
-      const onMouseUp = event => {
+      var onMouseUp = function onMouseUp(event) {
         mouseAndTouchTrackersRef.current.isMouseDown = false;
-        if (isOpen && !targetWithinDownshift(event.target, downshiftElementRefs.map(ref => ref.current), environment)) {
+        if (isOpen && !targetWithinDownshift(event.target, downshiftElementRefs.map(function (ref) {
+          return ref.current;
+        }), environment)) {
           handleBlur();
         }
       };
-      const onTouchStart = () => {
+      var onTouchStart = function onTouchStart() {
         mouseAndTouchTrackersRef.current.isTouchMove = false;
       };
-      const onTouchMove = () => {
+      var onTouchMove = function onTouchMove() {
         mouseAndTouchTrackersRef.current.isTouchMove = true;
       };
-      const onTouchEnd = event => {
-        if (isOpen && !mouseAndTouchTrackersRef.current.isTouchMove && !targetWithinDownshift(event.target, downshiftElementRefs.map(ref => ref.current), environment, false)) {
+      var onTouchEnd = function onTouchEnd(event) {
+        if (isOpen && !mouseAndTouchTrackersRef.current.isTouchMove && !targetWithinDownshift(event.target, downshiftElementRefs.map(function (ref) {
+          return ref.current;
+        }), environment, false)) {
           handleBlur();
         }
       };
@@ -3060,7 +3078,9 @@
 
   /* istanbul ignore next */
   // eslint-disable-next-line import/no-mutable-exports
-  let useGetterPropsCalledChecker = () => noop;
+  var useGetterPropsCalledChecker = function useGetterPropsCalledChecker() {
+    return noop;
+  };
   /**
    * Custom hook that checks if getter props are called correctly.
    *
@@ -3069,82 +3089,77 @@
    */
   /* istanbul ignore next */
   {
-    useGetterPropsCalledChecker = function () {
-      const isInitialMountRef = react.useRef(true);
+    useGetterPropsCalledChecker = function useGetterPropsCalledChecker() {
+      var isInitialMountRef = react.useRef(true);
       for (var _len = arguments.length, propKeys = new Array(_len), _key = 0; _key < _len; _key++) {
         propKeys[_key] = arguments[_key];
       }
-      const getterPropsCalledRef = react.useRef(propKeys.reduce((acc, propKey) => {
+      var getterPropsCalledRef = react.useRef(propKeys.reduce(function (acc, propKey) {
         acc[propKey] = {};
         return acc;
       }, {}));
-      react.useEffect(() => {
-        Object.keys(getterPropsCalledRef.current).forEach(propKey => {
-          const propCallInfo = getterPropsCalledRef.current[propKey];
+      react.useEffect(function () {
+        Object.keys(getterPropsCalledRef.current).forEach(function (propKey) {
+          var propCallInfo = getterPropsCalledRef.current[propKey];
           if (isInitialMountRef.current) {
             if (!Object.keys(propCallInfo).length) {
               // eslint-disable-next-line no-console
-              console.error(`downshift: You forgot to call the ${propKey} getter function on your component / element.`);
+              console.error("downshift: You forgot to call the " + propKey + " getter function on your component / element.");
               return;
             }
           }
-          const {
-            suppressRefError,
-            refKey,
-            elementRef
-          } = propCallInfo;
+          var suppressRefError = propCallInfo.suppressRefError,
+            refKey = propCallInfo.refKey,
+            elementRef = propCallInfo.elementRef;
           if ((!elementRef || !elementRef.current) && !suppressRefError) {
             // eslint-disable-next-line no-console
-            console.error(`downshift: The ref prop "${refKey}" from ${propKey} was not applied correctly on your element.`);
+            console.error("downshift: The ref prop \"" + refKey + "\" from " + propKey + " was not applied correctly on your element.");
           }
         });
         isInitialMountRef.current = false;
       });
-      const setGetterPropCallInfo = react.useCallback((propKey, suppressRefError, refKey, elementRef) => {
+      var setGetterPropCallInfo = react.useCallback(function (propKey, suppressRefError, refKey, elementRef) {
         getterPropsCalledRef.current[propKey] = {
-          suppressRefError,
-          refKey,
-          elementRef
+          suppressRefError: suppressRefError,
+          refKey: refKey,
+          elementRef: elementRef
         };
       }, []);
       return setGetterPropCallInfo;
     };
   }
   function useA11yMessageSetter(getA11yMessage, dependencyArray, _ref2) {
-    let {
-      isInitialMount,
-      highlightedIndex,
-      items,
-      environment,
-      ...rest
-    } = _ref2;
+    var isInitialMount = _ref2.isInitialMount,
+      highlightedIndex = _ref2.highlightedIndex,
+      items = _ref2.items,
+      environment = _ref2.environment,
+      rest = _objectWithoutPropertiesLoose(_ref2, _excluded$3);
     // Sets a11y status message on changes in state.
-    react.useEffect(() => {
+    react.useEffect(function () {
       if (isInitialMount || false) {
         return;
       }
-      updateA11yStatus(() => getA11yMessage({
-        highlightedIndex,
-        highlightedItem: items[highlightedIndex],
-        resultCount: items.length,
-        ...rest
-      }), environment.document);
+      updateA11yStatus(function () {
+        return getA11yMessage(_extends({
+          highlightedIndex: highlightedIndex,
+          highlightedItem: items[highlightedIndex],
+          resultCount: items.length
+        }, rest));
+      }, environment.document);
       // eslint-disable-next-line react-hooks/exhaustive-deps
     }, dependencyArray);
   }
   function useScrollIntoView(_ref3) {
-    let {
-      highlightedIndex,
-      isOpen,
-      itemRefs,
-      getItemNodeFromIndex,
-      menuElement,
-      scrollIntoView: scrollIntoViewProp
-    } = _ref3;
+    var highlightedIndex = _ref3.highlightedIndex,
+      isOpen = _ref3.isOpen,
+      itemRefs = _ref3.itemRefs,
+      getItemNodeFromIndex = _ref3.getItemNodeFromIndex,
+      menuElement = _ref3.menuElement,
+      scrollIntoViewProp = _ref3.scrollIntoView;
     // used not to scroll on highlight by mouse.
-    const shouldScrollRef = react.useRef(true);
+    var shouldScrollRef = react.useRef(true);
     // Scroll on highlighted item if change comes from keyboard.
-    useIsomorphicLayoutEffect(() => {
+    useIsomorphicLayoutEffect(function () {
       if (highlightedIndex < 0 || !isOpen || !Object.keys(itemRefs.current).length) {
         return;
       }
@@ -3159,18 +3174,16 @@
   }
 
   // eslint-disable-next-line import/no-mutable-exports
-  let useControlPropsValidator = noop;
+  var useControlPropsValidator = noop;
   /* istanbul ignore next */
   {
-    useControlPropsValidator = _ref4 => {
-      let {
-        isInitialMount,
-        props,
-        state
-      } = _ref4;
+    useControlPropsValidator = function useControlPropsValidator(_ref4) {
+      var isInitialMount = _ref4.isInitialMount,
+        props = _ref4.props,
+        state = _ref4.state;
       // used for checking when props are moving from controlled to uncontrolled.
-      const prevPropsRef = react.useRef(props);
-      react.useEffect(() => {
+      var prevPropsRef = react.useRef(props);
+      react.useEffect(function () {
         if (isInitialMount) {
           return;
         }
@@ -3181,11 +3194,9 @@
   }
 
   function downshiftCommonReducer(state, action, stateChangeTypes) {
-    const {
-      type,
-      props
-    } = action;
-    let changes;
+    var type = action.type,
+      props = action.props;
+    var changes;
     switch (type) {
       case stateChangeTypes.ItemMouseMove:
         changes = {
@@ -3236,10 +3247,7 @@
       default:
         throw new Error('Reducer called without proper action type.');
     }
-    return {
-      ...state,
-      ...changes
-    };
+    return _extends({}, state, changes);
   }
   /* eslint-enable complexity */
 
@@ -3351,28 +3359,28 @@
       };
   }
 
-  const ToggleButtonClick$1 = '__togglebutton_click__' ;
-  const ToggleButtonKeyDownArrowDown = '__togglebutton_keydown_arrow_down__' ;
-  const ToggleButtonKeyDownArrowUp = '__togglebutton_keydown_arrow_up__' ;
-  const ToggleButtonKeyDownCharacter = '__togglebutton_keydown_character__' ;
-  const ToggleButtonKeyDownEscape = '__togglebutton_keydown_escape__' ;
-  const ToggleButtonKeyDownHome = '__togglebutton_keydown_home__' ;
-  const ToggleButtonKeyDownEnd = '__togglebutton_keydown_end__' ;
-  const ToggleButtonKeyDownEnter = '__togglebutton_keydown_enter__' ;
-  const ToggleButtonKeyDownSpaceButton = '__togglebutton_keydown_space_button__' ;
-  const ToggleButtonKeyDownPageUp = '__togglebutton_keydown_page_up__' ;
-  const ToggleButtonKeyDownPageDown = '__togglebutton_keydown_page_down__' ;
-  const ToggleButtonBlur = '__togglebutton_blur__' ;
-  const MenuMouseLeave$1 = '__menu_mouse_leave__' ;
-  const ItemMouseMove$1 = '__item_mouse_move__' ;
-  const ItemClick$1 = '__item_click__' ;
-  const FunctionToggleMenu$1 = '__function_toggle_menu__' ;
-  const FunctionOpenMenu$1 = '__function_open_menu__' ;
-  const FunctionCloseMenu$1 = '__function_close_menu__' ;
-  const FunctionSetHighlightedIndex$1 = '__function_set_highlighted_index__' ;
-  const FunctionSelectItem$1 = '__function_select_item__' ;
-  const FunctionSetInputValue$1 = '__function_set_input_value__' ;
-  const FunctionReset$2 = '__function_reset__' ;
+  var ToggleButtonClick$1 = '__togglebutton_click__' ;
+  var ToggleButtonKeyDownArrowDown = '__togglebutton_keydown_arrow_down__' ;
+  var ToggleButtonKeyDownArrowUp = '__togglebutton_keydown_arrow_up__' ;
+  var ToggleButtonKeyDownCharacter = '__togglebutton_keydown_character__' ;
+  var ToggleButtonKeyDownEscape = '__togglebutton_keydown_escape__' ;
+  var ToggleButtonKeyDownHome = '__togglebutton_keydown_home__' ;
+  var ToggleButtonKeyDownEnd = '__togglebutton_keydown_end__' ;
+  var ToggleButtonKeyDownEnter = '__togglebutton_keydown_enter__' ;
+  var ToggleButtonKeyDownSpaceButton = '__togglebutton_keydown_space_button__' ;
+  var ToggleButtonKeyDownPageUp = '__togglebutton_keydown_page_up__' ;
+  var ToggleButtonKeyDownPageDown = '__togglebutton_keydown_page_down__' ;
+  var ToggleButtonBlur = '__togglebutton_blur__' ;
+  var MenuMouseLeave$1 = '__menu_mouse_leave__' ;
+  var ItemMouseMove$1 = '__item_mouse_move__' ;
+  var ItemClick$1 = '__item_click__' ;
+  var FunctionToggleMenu$1 = '__function_toggle_menu__' ;
+  var FunctionOpenMenu$1 = '__function_open_menu__' ;
+  var FunctionCloseMenu$1 = '__function_close_menu__' ;
+  var FunctionSetHighlightedIndex$1 = '__function_set_highlighted_index__' ;
+  var FunctionSelectItem$1 = '__function_select_item__' ;
+  var FunctionSetInputValue$1 = '__function_set_input_value__' ;
+  var FunctionReset$2 = '__function_reset__' ;
 
   var stateChangeTypes$2 = /*#__PURE__*/Object.freeze({
     __proto__: null,
@@ -3402,12 +3410,10 @@
 
   /* eslint-disable complexity */
   function downshiftSelectReducer(state, action) {
-    const {
-      type,
-      props,
-      altKey
-    } = action;
-    let changes;
+    var type = action.type,
+      props = action.props,
+      altKey = action.altKey;
+    var changes;
     switch (type) {
       case ItemClick$1:
         changes = {
@@ -3418,10 +3424,10 @@
         break;
       case ToggleButtonKeyDownCharacter:
         {
-          const lowercasedKey = action.key;
-          const inputValue = `${state.inputValue}${lowercasedKey}`;
-          const prevHighlightedIndex = !state.isOpen && state.selectedItem ? props.items.indexOf(state.selectedItem) : state.highlightedIndex;
-          const highlightedIndex = getItemIndexByCharacterKey({
+          var lowercasedKey = action.key;
+          var inputValue = "" + state.inputValue + lowercasedKey;
+          var prevHighlightedIndex = !state.isOpen && state.selectedItem ? props.items.indexOf(state.selectedItem) : state.highlightedIndex;
+          var highlightedIndex = getItemIndexByCharacterKey({
             keysSoFar: inputValue,
             highlightedIndex: prevHighlightedIndex,
             items: props.items,
@@ -3429,34 +3435,33 @@
             getItemNodeFromIndex: action.getItemNodeFromIndex
           });
           changes = {
-            inputValue,
-            highlightedIndex,
+            inputValue: inputValue,
+            highlightedIndex: highlightedIndex,
             isOpen: true
           };
         }
         break;
       case ToggleButtonKeyDownArrowDown:
         {
-          const highlightedIndex = state.isOpen ? getNextWrappingIndex(1, state.highlightedIndex, props.items.length, action.getItemNodeFromIndex, false) : altKey && state.selectedItem == null ? -1 : getHighlightedIndexOnOpen(props, state, 1);
+          var _highlightedIndex = state.isOpen ? getNextWrappingIndex(1, state.highlightedIndex, props.items.length, action.getItemNodeFromIndex, false) : altKey && state.selectedItem == null ? -1 : getHighlightedIndexOnOpen(props, state, 1);
           changes = {
-            highlightedIndex,
+            highlightedIndex: _highlightedIndex,
             isOpen: true
           };
         }
         break;
       case ToggleButtonKeyDownArrowUp:
         if (state.isOpen && altKey) {
-          changes = {
+          changes = _extends({
             isOpen: getDefaultValue$1(props, 'isOpen'),
-            highlightedIndex: getDefaultValue$1(props, 'highlightedIndex'),
-            ...(state.highlightedIndex >= 0 && {
-              selectedItem: props.items[state.highlightedIndex]
-            })
-          };
+            highlightedIndex: getDefaultValue$1(props, 'highlightedIndex')
+          }, state.highlightedIndex >= 0 && {
+            selectedItem: props.items[state.highlightedIndex]
+          });
         } else {
-          const highlightedIndex = state.isOpen ? getNextWrappingIndex(-1, state.highlightedIndex, props.items.length, action.getItemNodeFromIndex, false) : getHighlightedIndexOnOpen(props, state, -1);
+          var _highlightedIndex2 = state.isOpen ? getNextWrappingIndex(-1, state.highlightedIndex, props.items.length, action.getItemNodeFromIndex, false) : getHighlightedIndexOnOpen(props, state, -1);
           changes = {
-            highlightedIndex,
+            highlightedIndex: _highlightedIndex2,
             isOpen: true
           };
         }
@@ -3464,13 +3469,12 @@
       // only triggered when menu is open.
       case ToggleButtonKeyDownEnter:
       case ToggleButtonKeyDownSpaceButton:
-        changes = {
+        changes = _extends({
           isOpen: getDefaultValue$1(props, 'isOpen'),
-          highlightedIndex: getDefaultValue$1(props, 'highlightedIndex'),
-          ...(state.highlightedIndex >= 0 && {
-            selectedItem: props.items[state.highlightedIndex]
-          })
-        };
+          highlightedIndex: getDefaultValue$1(props, 'highlightedIndex')
+        }, state.highlightedIndex >= 0 && {
+          selectedItem: props.items[state.highlightedIndex]
+        });
         break;
       case ToggleButtonKeyDownHome:
         changes = {
@@ -3501,13 +3505,12 @@
         };
         break;
       case ToggleButtonBlur:
-        changes = {
+        changes = _extends({
           isOpen: false,
-          highlightedIndex: -1,
-          ...(state.highlightedIndex >= 0 && {
-            selectedItem: props.items[state.highlightedIndex]
-          })
-        };
+          highlightedIndex: -1
+        }, state.highlightedIndex >= 0 && {
+          selectedItem: props.items[state.highlightedIndex]
+        });
         break;
       case FunctionSelectItem$1:
         changes = {
@@ -3517,13 +3520,13 @@
       default:
         return downshiftCommonReducer(state, action, stateChangeTypes$2);
     }
-    return {
-      ...state,
-      ...changes
-    };
+    return _extends({}, state, changes);
   }
   /* eslint-enable complexity */
 
+  var _excluded$2 = ["onMouseLeave", "refKey", "onKeyDown", "onBlur", "ref"],
+    _excluded2$2 = ["onBlur", "onClick", "onKeyDown", "refKey", "ref"],
+    _excluded3$1 = ["item", "index", "onMouseMove", "onClick", "refKey", "ref", "disabled"];
   useSelect.stateChangeTypes = stateChangeTypes$2;
   function useSelect(userProps) {
     if (userProps === void 0) {
@@ -3531,81 +3534,76 @@
     }
     validatePropTypes$2(userProps, useSelect);
     // Props defaults and destructuring.
-    const props = {
-      ...defaultProps$2,
-      ...userProps
-    };
-    const {
-      items,
-      scrollIntoView,
-      environment,
-      itemToString,
-      getA11ySelectionMessage,
-      getA11yStatusMessage
-    } = props;
+    var props = _extends({}, defaultProps$2, userProps);
+    var items = props.items,
+      scrollIntoView = props.scrollIntoView,
+      environment = props.environment,
+      itemToString = props.itemToString,
+      getA11ySelectionMessage = props.getA11ySelectionMessage,
+      getA11yStatusMessage = props.getA11yStatusMessage;
     // Initial state depending on controlled props.
-    const initialState = getInitialState$2(props);
-    const [state, dispatch] = useControlledReducer$1(downshiftSelectReducer, initialState, props);
-    const {
-      isOpen,
-      highlightedIndex,
-      selectedItem,
-      inputValue
-    } = state;
+    var initialState = getInitialState$2(props);
+    var _useControlledReducer = useControlledReducer$1(downshiftSelectReducer, initialState, props),
+      state = _useControlledReducer[0],
+      dispatch = _useControlledReducer[1];
+    var isOpen = state.isOpen,
+      highlightedIndex = state.highlightedIndex,
+      selectedItem = state.selectedItem,
+      inputValue = state.inputValue;
 
     // Element efs.
-    const toggleButtonRef = react.useRef(null);
-    const menuRef = react.useRef(null);
-    const itemRefs = react.useRef({});
+    var toggleButtonRef = react.useRef(null);
+    var menuRef = react.useRef(null);
+    var itemRefs = react.useRef({});
     // used to keep the inputValue clearTimeout object between renders.
-    const clearTimeoutRef = react.useRef(null);
+    var clearTimeoutRef = react.useRef(null);
     // prevent id re-generation between renders.
-    const elementIds = useElementIds(props);
+    var elementIds = useElementIds(props);
     // used to keep track of how many items we had on previous cycle.
-    const previousResultCountRef = react.useRef();
-    const isInitialMountRef = react.useRef(true);
+    var previousResultCountRef = react.useRef();
+    var isInitialMountRef = react.useRef(true);
     // utility callback to get item element.
-    const latest = useLatestRef({
-      state,
-      props
+    var latest = useLatestRef({
+      state: state,
+      props: props
     });
 
     // Some utils.
-    const getItemNodeFromIndex = react.useCallback(index => itemRefs.current[elementIds.getItemId(index)], [elementIds]);
+    var getItemNodeFromIndex = react.useCallback(function (index) {
+      return itemRefs.current[elementIds.getItemId(index)];
+    }, [elementIds]);
 
     // Effects.
     // Sets a11y status message on changes in state.
-    useA11yMessageSetter(getA11yStatusMessage, [isOpen, highlightedIndex, inputValue, items], {
+    useA11yMessageSetter(getA11yStatusMessage, [isOpen, highlightedIndex, inputValue, items], _extends({
       isInitialMount: isInitialMountRef.current,
       previousResultCount: previousResultCountRef.current,
-      items,
-      environment,
-      itemToString,
-      ...state
-    });
+      items: items,
+      environment: environment,
+      itemToString: itemToString
+    }, state));
     // Sets a11y status message on changes in selectedItem.
-    useA11yMessageSetter(getA11ySelectionMessage, [selectedItem], {
+    useA11yMessageSetter(getA11ySelectionMessage, [selectedItem], _extends({
       isInitialMount: isInitialMountRef.current,
       previousResultCount: previousResultCountRef.current,
-      items,
-      environment,
-      itemToString,
-      ...state
-    });
+      items: items,
+      environment: environment,
+      itemToString: itemToString
+    }, state));
     // Scroll on highlighted item if change comes from keyboard.
-    const shouldScrollRef = useScrollIntoView({
+    var shouldScrollRef = useScrollIntoView({
       menuElement: menuRef.current,
-      highlightedIndex,
-      isOpen,
-      itemRefs,
-      scrollIntoView,
-      getItemNodeFromIndex
+      highlightedIndex: highlightedIndex,
+      isOpen: isOpen,
+      itemRefs: itemRefs,
+      scrollIntoView: scrollIntoView,
+      getItemNodeFromIndex: getItemNodeFromIndex
     });
 
     // Sets cleanup for the keysSoFar callback, debounded after 500ms.
-    react.useEffect(() => {
+    react.useEffect(function () {
       // init the clean function here as we need access to dispatch.
-      clearTimeoutRef.current = debounce(outerDispatch => {
+      clearTimeoutRef.current = debounce(function (outerDispatch) {
         outerDispatch({
           type: FunctionSetInputValue$1,
           inputValue: ''
@@ -3613,13 +3611,13 @@
       }, 500);
 
       // Cancel any pending debounced calls on mount
-      return () => {
+      return function () {
         clearTimeoutRef.current.cancel();
       };
     }, []);
 
     // Invokes the keysSoFar callback set up above.
-    react.useEffect(() => {
+    react.useEffect(function () {
       if (!inputValue) {
         return;
       }
@@ -3627,249 +3625,234 @@
     }, [dispatch, inputValue]);
     useControlPropsValidator({
       isInitialMount: isInitialMountRef.current,
-      props,
-      state
+      props: props,
+      state: state
     });
-    react.useEffect(() => {
+    react.useEffect(function () {
       if (isInitialMountRef.current) {
         return;
       }
       previousResultCountRef.current = items.length;
     });
     // Add mouse/touch events to document.
-    const mouseAndTouchTrackersRef = useMouseAndTouchTracker(isOpen, [menuRef, toggleButtonRef], environment, () => {
+    var mouseAndTouchTrackersRef = useMouseAndTouchTracker(isOpen, [menuRef, toggleButtonRef], environment, function () {
       dispatch({
         type: ToggleButtonBlur
       });
     });
-    const setGetterPropCallInfo = useGetterPropsCalledChecker('getMenuProps', 'getToggleButtonProps');
+    var setGetterPropCallInfo = useGetterPropsCalledChecker('getMenuProps', 'getToggleButtonProps');
     // Make initial ref false.
-    react.useEffect(() => {
+    react.useEffect(function () {
       isInitialMountRef.current = false;
-      return () => {
+      return function () {
         isInitialMountRef.current = true;
       };
     }, []);
     // Reset itemRefs on close.
-    react.useEffect(() => {
+    react.useEffect(function () {
       if (!isOpen) {
         itemRefs.current = {};
       }
     }, [isOpen]);
 
     // Event handler functions.
-    const toggleButtonKeyDownHandlers = react.useMemo(() => ({
-      ArrowDown(event) {
-        event.preventDefault();
-        dispatch({
-          type: ToggleButtonKeyDownArrowDown,
-          getItemNodeFromIndex,
-          altKey: event.altKey
-        });
-      },
-      ArrowUp(event) {
-        event.preventDefault();
-        dispatch({
-          type: ToggleButtonKeyDownArrowUp,
-          getItemNodeFromIndex,
-          altKey: event.altKey
-        });
-      },
-      Home(event) {
-        event.preventDefault();
-        dispatch({
-          type: ToggleButtonKeyDownHome,
-          getItemNodeFromIndex
-        });
-      },
-      End(event) {
-        event.preventDefault();
-        dispatch({
-          type: ToggleButtonKeyDownEnd,
-          getItemNodeFromIndex
-        });
-      },
-      Escape() {
-        if (latest.current.state.isOpen) {
-          dispatch({
-            type: ToggleButtonKeyDownEscape
-          });
-        }
-      },
-      Enter(event) {
-        event.preventDefault();
-        dispatch({
-          type: latest.current.state.isOpen ? ToggleButtonKeyDownEnter : ToggleButtonClick$1
-        });
-      },
-      PageUp(event) {
-        if (latest.current.state.isOpen) {
+    var toggleButtonKeyDownHandlers = react.useMemo(function () {
+      return {
+        ArrowDown: function ArrowDown(event) {
           event.preventDefault();
           dispatch({
-            type: ToggleButtonKeyDownPageUp,
-            getItemNodeFromIndex
+            type: ToggleButtonKeyDownArrowDown,
+            getItemNodeFromIndex: getItemNodeFromIndex,
+            altKey: event.altKey
           });
-        }
-      },
-      PageDown(event) {
-        if (latest.current.state.isOpen) {
+        },
+        ArrowUp: function ArrowUp(event) {
           event.preventDefault();
           dispatch({
-            type: ToggleButtonKeyDownPageDown,
-            getItemNodeFromIndex
+            type: ToggleButtonKeyDownArrowUp,
+            getItemNodeFromIndex: getItemNodeFromIndex,
+            altKey: event.altKey
           });
-        }
-      },
-      ' '(event) {
-        event.preventDefault();
-        const currentState = latest.current.state;
-        if (!currentState.isOpen) {
+        },
+        Home: function Home(event) {
+          event.preventDefault();
           dispatch({
-            type: ToggleButtonClick$1
+            type: ToggleButtonKeyDownHome,
+            getItemNodeFromIndex: getItemNodeFromIndex
           });
-          return;
-        }
-        if (currentState.inputValue) {
+        },
+        End: function End(event) {
+          event.preventDefault();
           dispatch({
-            type: ToggleButtonKeyDownCharacter,
-            key: ' ',
-            getItemNodeFromIndex
+            type: ToggleButtonKeyDownEnd,
+            getItemNodeFromIndex: getItemNodeFromIndex
           });
-        } else {
+        },
+        Escape: function Escape() {
+          if (latest.current.state.isOpen) {
+            dispatch({
+              type: ToggleButtonKeyDownEscape
+            });
+          }
+        },
+        Enter: function Enter(event) {
+          event.preventDefault();
           dispatch({
-            type: ToggleButtonKeyDownSpaceButton
+            type: latest.current.state.isOpen ? ToggleButtonKeyDownEnter : ToggleButtonClick$1
           });
+        },
+        PageUp: function PageUp(event) {
+          if (latest.current.state.isOpen) {
+            event.preventDefault();
+            dispatch({
+              type: ToggleButtonKeyDownPageUp,
+              getItemNodeFromIndex: getItemNodeFromIndex
+            });
+          }
+        },
+        PageDown: function PageDown(event) {
+          if (latest.current.state.isOpen) {
+            event.preventDefault();
+            dispatch({
+              type: ToggleButtonKeyDownPageDown,
+              getItemNodeFromIndex: getItemNodeFromIndex
+            });
+          }
+        },
+        ' ': function _(event) {
+          event.preventDefault();
+          var currentState = latest.current.state;
+          if (!currentState.isOpen) {
+            dispatch({
+              type: ToggleButtonClick$1
+            });
+            return;
+          }
+          if (currentState.inputValue) {
+            dispatch({
+              type: ToggleButtonKeyDownCharacter,
+              key: ' ',
+              getItemNodeFromIndex: getItemNodeFromIndex
+            });
+          } else {
+            dispatch({
+              type: ToggleButtonKeyDownSpaceButton
+            });
+          }
         }
-      }
-    }), [dispatch, getItemNodeFromIndex, latest]);
+      };
+    }, [dispatch, getItemNodeFromIndex, latest]);
 
     // Action functions.
-    const toggleMenu = react.useCallback(() => {
+    var toggleMenu = react.useCallback(function () {
       dispatch({
         type: FunctionToggleMenu$1
       });
     }, [dispatch]);
-    const closeMenu = react.useCallback(() => {
+    var closeMenu = react.useCallback(function () {
       dispatch({
         type: FunctionCloseMenu$1
       });
     }, [dispatch]);
-    const openMenu = react.useCallback(() => {
+    var openMenu = react.useCallback(function () {
       dispatch({
         type: FunctionOpenMenu$1
       });
     }, [dispatch]);
-    const setHighlightedIndex = react.useCallback(newHighlightedIndex => {
+    var setHighlightedIndex = react.useCallback(function (newHighlightedIndex) {
       dispatch({
         type: FunctionSetHighlightedIndex$1,
         highlightedIndex: newHighlightedIndex
       });
     }, [dispatch]);
-    const selectItem = react.useCallback(newSelectedItem => {
+    var selectItem = react.useCallback(function (newSelectedItem) {
       dispatch({
         type: FunctionSelectItem$1,
         selectedItem: newSelectedItem
       });
     }, [dispatch]);
-    const reset = react.useCallback(() => {
+    var reset = react.useCallback(function () {
       dispatch({
         type: FunctionReset$2
       });
     }, [dispatch]);
-    const setInputValue = react.useCallback(newInputValue => {
+    var setInputValue = react.useCallback(function (newInputValue) {
       dispatch({
         type: FunctionSetInputValue$1,
         inputValue: newInputValue
       });
     }, [dispatch]);
     // Getter functions.
-    const getLabelProps = react.useCallback(labelProps => ({
-      id: elementIds.labelId,
-      htmlFor: elementIds.toggleButtonId,
-      ...labelProps
-    }), [elementIds]);
-    const getMenuProps = react.useCallback(function (_temp, _temp2) {
-      let {
-        onMouseLeave,
-        refKey = 'ref',
-        onKeyDown,
-        onBlur,
-        ref,
-        ...rest
-      } = _temp === void 0 ? {} : _temp;
-      let {
-        suppressRefError = false
-      } = _temp2 === void 0 ? {} : _temp2;
-      const menuHandleMouseLeave = () => {
+    var getLabelProps = react.useCallback(function (labelProps) {
+      return _extends({
+        id: elementIds.labelId,
+        htmlFor: elementIds.toggleButtonId
+      }, labelProps);
+    }, [elementIds]);
+    var getMenuProps = react.useCallback(function (_temp, _temp2) {
+      var _extends2;
+      var _ref = _temp === void 0 ? {} : _temp,
+        onMouseLeave = _ref.onMouseLeave,
+        _ref$refKey = _ref.refKey,
+        refKey = _ref$refKey === void 0 ? 'ref' : _ref$refKey;
+        _ref.onKeyDown;
+        _ref.onBlur;
+        var ref = _ref.ref,
+        rest = _objectWithoutPropertiesLoose(_ref, _excluded$2);
+      var _ref2 = _temp2 === void 0 ? {} : _temp2,
+        _ref2$suppressRefErro = _ref2.suppressRefError,
+        suppressRefError = _ref2$suppressRefErro === void 0 ? false : _ref2$suppressRefErro;
+      var menuHandleMouseLeave = function menuHandleMouseLeave() {
         dispatch({
           type: MenuMouseLeave$1
         });
       };
       setGetterPropCallInfo('getMenuProps', suppressRefError, refKey, menuRef);
-      return {
-        [refKey]: handleRefs(ref, menuNode => {
-          menuRef.current = menuNode;
-        }),
-        id: elementIds.menuId,
-        role: 'listbox',
-        'aria-labelledby': elementIds.labelId,
-        tabIndex: -1,
-        onMouseLeave: callAllEventHandlers(onMouseLeave, menuHandleMouseLeave),
-        ...rest
-      };
+      return _extends((_extends2 = {}, _extends2[refKey] = handleRefs(ref, function (menuNode) {
+        menuRef.current = menuNode;
+      }), _extends2.id = elementIds.menuId, _extends2.role = 'listbox', _extends2['aria-labelledby'] = elementIds.labelId, _extends2.tabIndex = -1, _extends2.onMouseLeave = callAllEventHandlers(onMouseLeave, menuHandleMouseLeave), _extends2), rest);
     }, [dispatch, setGetterPropCallInfo, elementIds]);
-    const getToggleButtonProps = react.useCallback(function (_temp3, _temp4) {
-      let {
-        onBlur,
-        onClick,
-        onKeyDown,
-        refKey = 'ref',
-        ref,
-        ...rest
-      } = _temp3 === void 0 ? {} : _temp3;
-      let {
-        suppressRefError = false
-      } = _temp4 === void 0 ? {} : _temp4;
-      const latestState = latest.current.state;
-      const toggleButtonHandleClick = () => {
+    var getToggleButtonProps = react.useCallback(function (_temp3, _temp4) {
+      var _extends3;
+      var _ref3 = _temp3 === void 0 ? {} : _temp3,
+        onBlur = _ref3.onBlur,
+        onClick = _ref3.onClick,
+        onKeyDown = _ref3.onKeyDown,
+        _ref3$refKey = _ref3.refKey,
+        refKey = _ref3$refKey === void 0 ? 'ref' : _ref3$refKey,
+        ref = _ref3.ref,
+        rest = _objectWithoutPropertiesLoose(_ref3, _excluded2$2);
+      var _ref4 = _temp4 === void 0 ? {} : _temp4,
+        _ref4$suppressRefErro = _ref4.suppressRefError,
+        suppressRefError = _ref4$suppressRefErro === void 0 ? false : _ref4$suppressRefErro;
+      var latestState = latest.current.state;
+      var toggleButtonHandleClick = function toggleButtonHandleClick() {
         dispatch({
           type: ToggleButtonClick$1
         });
       };
-      const toggleButtonHandleBlur = () => {
+      var toggleButtonHandleBlur = function toggleButtonHandleBlur() {
         if (latestState.isOpen && !mouseAndTouchTrackersRef.current.isMouseDown) {
           dispatch({
             type: ToggleButtonBlur
           });
         }
       };
-      const toggleButtonHandleKeyDown = event => {
-        const key = normalizeArrowKey(event);
+      var toggleButtonHandleKeyDown = function toggleButtonHandleKeyDown(event) {
+        var key = normalizeArrowKey(event);
         if (key && toggleButtonKeyDownHandlers[key]) {
           toggleButtonKeyDownHandlers[key](event);
         } else if (isAcceptedCharacterKey(key)) {
           dispatch({
             type: ToggleButtonKeyDownCharacter,
-            key,
-            getItemNodeFromIndex
+            key: key,
+            getItemNodeFromIndex: getItemNodeFromIndex
           });
         }
       };
-      const toggleProps = {
-        [refKey]: handleRefs(ref, toggleButtonNode => {
-          toggleButtonRef.current = toggleButtonNode;
-        }),
-        'aria-activedescendant': latestState.isOpen && latestState.highlightedIndex > -1 ? elementIds.getItemId(latestState.highlightedIndex) : '',
-        'aria-controls': elementIds.menuId,
-        'aria-expanded': latest.current.state.isOpen,
-        'aria-haspopup': 'listbox',
-        'aria-labelledby': `${elementIds.labelId}`,
-        id: elementIds.toggleButtonId,
-        role: 'combobox',
-        tabIndex: 0,
-        onBlur: callAllEventHandlers(onBlur, toggleButtonHandleBlur),
-        ...rest
-      };
+      var toggleProps = _extends((_extends3 = {}, _extends3[refKey] = handleRefs(ref, function (toggleButtonNode) {
+        toggleButtonRef.current = toggleButtonNode;
+      }), _extends3['aria-activedescendant'] = latestState.isOpen && latestState.highlightedIndex > -1 ? elementIds.getItemId(latestState.highlightedIndex) : '', _extends3['aria-controls'] = elementIds.menuId, _extends3['aria-expanded'] = latest.current.state.isOpen, _extends3['aria-haspopup'] = 'listbox', _extends3['aria-labelledby'] = "" + elementIds.labelId, _extends3.id = elementIds.toggleButtonId, _extends3.role = 'combobox', _extends3.tabIndex = 0, _extends3.onBlur = callAllEventHandlers(onBlur, toggleButtonHandleBlur), _extends3), rest);
       if (!rest.disabled) {
         toggleProps.onClick = callAllEventHandlers(onClick, toggleButtonHandleClick);
         toggleProps.onKeyDown = callAllEventHandlers(onKeyDown, toggleButtonHandleKeyDown);
@@ -3877,56 +3860,54 @@
       setGetterPropCallInfo('getToggleButtonProps', suppressRefError, refKey, toggleButtonRef);
       return toggleProps;
     }, [latest, elementIds, setGetterPropCallInfo, dispatch, mouseAndTouchTrackersRef, toggleButtonKeyDownHandlers, getItemNodeFromIndex]);
-    const getItemProps = react.useCallback(function (_temp5) {
-      let {
-        item: itemProp,
-        index: indexProp,
-        onMouseMove,
-        onClick,
-        refKey = 'ref',
-        ref,
-        disabled,
-        ...rest
-      } = _temp5 === void 0 ? {} : _temp5;
-      const {
-        state: latestState,
-        props: latestProps
-      } = latest.current;
-      const item = itemProp ?? items[indexProp];
-      const index = getItemIndex(indexProp, item, latestProps.items);
-      const itemHandleMouseMove = () => {
+    var getItemProps = react.useCallback(function (_temp5) {
+      var _extends4;
+      var _ref5 = _temp5 === void 0 ? {} : _temp5,
+        itemProp = _ref5.item,
+        indexProp = _ref5.index,
+        onMouseMove = _ref5.onMouseMove,
+        onClick = _ref5.onClick,
+        _ref5$refKey = _ref5.refKey,
+        refKey = _ref5$refKey === void 0 ? 'ref' : _ref5$refKey,
+        ref = _ref5.ref,
+        disabled = _ref5.disabled,
+        rest = _objectWithoutPropertiesLoose(_ref5, _excluded3$1);
+      var _latest$current = latest.current,
+        latestState = _latest$current.state,
+        latestProps = _latest$current.props;
+      var item = itemProp != null ? itemProp : items[indexProp];
+      var index = getItemIndex(indexProp, item, latestProps.items);
+      var itemHandleMouseMove = function itemHandleMouseMove() {
         if (index === latestState.highlightedIndex) {
           return;
         }
         shouldScrollRef.current = false;
         dispatch({
           type: ItemMouseMove$1,
-          index,
-          disabled
+          index: index,
+          disabled: disabled
         });
       };
-      const itemHandleClick = () => {
+      var itemHandleClick = function itemHandleClick() {
         dispatch({
           type: ItemClick$1,
-          index
+          index: index
         });
       };
-      const itemIndex = getItemIndex(index, item, latestProps.items);
+      var itemIndex = getItemIndex(index, item, latestProps.items);
       if (itemIndex < 0) {
         throw new Error('Pass either item or item index in getItemProps!');
       }
-      const itemProps = {
-        disabled,
+      var itemProps = _extends((_extends4 = {
+        disabled: disabled,
         role: 'option',
-        'aria-selected': `${item === selectedItem}`,
-        id: elementIds.getItemId(itemIndex),
-        [refKey]: handleRefs(ref, itemNode => {
-          if (itemNode) {
-            itemRefs.current[elementIds.getItemId(itemIndex)] = itemNode;
-          }
-        }),
-        ...rest
-      };
+        'aria-selected': "" + (item === selectedItem),
+        id: elementIds.getItemId(itemIndex)
+      }, _extends4[refKey] = handleRefs(ref, function (itemNode) {
+        if (itemNode) {
+          itemRefs.current[elementIds.getItemId(itemIndex)] = itemNode;
+        }
+      }), _extends4), rest);
       if (!disabled) {
         itemProps.onClick = callAllEventHandlers(onClick, itemHandleClick);
       }
@@ -3935,49 +3916,49 @@
     }, [latest, items, selectedItem, elementIds, shouldScrollRef, dispatch]);
     return {
       // prop getters.
-      getToggleButtonProps,
-      getLabelProps,
-      getMenuProps,
-      getItemProps,
+      getToggleButtonProps: getToggleButtonProps,
+      getLabelProps: getLabelProps,
+      getMenuProps: getMenuProps,
+      getItemProps: getItemProps,
       // actions.
-      toggleMenu,
-      openMenu,
-      closeMenu,
-      setHighlightedIndex,
-      selectItem,
-      reset,
-      setInputValue,
+      toggleMenu: toggleMenu,
+      openMenu: openMenu,
+      closeMenu: closeMenu,
+      setHighlightedIndex: setHighlightedIndex,
+      selectItem: selectItem,
+      reset: reset,
+      setInputValue: setInputValue,
       // state.
-      highlightedIndex,
-      isOpen,
-      selectedItem,
-      inputValue
+      highlightedIndex: highlightedIndex,
+      isOpen: isOpen,
+      selectedItem: selectedItem,
+      inputValue: inputValue
     };
   }
 
-  const InputKeyDownArrowDown = '__input_keydown_arrow_down__' ;
-  const InputKeyDownArrowUp = '__input_keydown_arrow_up__' ;
-  const InputKeyDownEscape = '__input_keydown_escape__' ;
-  const InputKeyDownHome = '__input_keydown_home__' ;
-  const InputKeyDownEnd = '__input_keydown_end__' ;
-  const InputKeyDownPageUp = '__input_keydown_page_up__' ;
-  const InputKeyDownPageDown = '__input_keydown_page_down__' ;
-  const InputKeyDownEnter = '__input_keydown_enter__' ;
-  const InputChange = '__input_change__' ;
-  const InputBlur = '__input_blur__' ;
-  const InputFocus = '__input_focus__' ;
-  const MenuMouseLeave = '__menu_mouse_leave__' ;
-  const ItemMouseMove = '__item_mouse_move__' ;
-  const ItemClick = '__item_click__' ;
-  const ToggleButtonClick = '__togglebutton_click__' ;
-  const FunctionToggleMenu = '__function_toggle_menu__' ;
-  const FunctionOpenMenu = '__function_open_menu__' ;
-  const FunctionCloseMenu = '__function_close_menu__' ;
-  const FunctionSetHighlightedIndex = '__function_set_highlighted_index__' ;
-  const FunctionSelectItem = '__function_select_item__' ;
-  const FunctionSetInputValue = '__function_set_input_value__' ;
-  const FunctionReset$1 = '__function_reset__' ;
-  const ControlledPropUpdatedSelectedItem = '__controlled_prop_updated_selected_item__' ;
+  var InputKeyDownArrowDown = '__input_keydown_arrow_down__' ;
+  var InputKeyDownArrowUp = '__input_keydown_arrow_up__' ;
+  var InputKeyDownEscape = '__input_keydown_escape__' ;
+  var InputKeyDownHome = '__input_keydown_home__' ;
+  var InputKeyDownEnd = '__input_keydown_end__' ;
+  var InputKeyDownPageUp = '__input_keydown_page_up__' ;
+  var InputKeyDownPageDown = '__input_keydown_page_down__' ;
+  var InputKeyDownEnter = '__input_keydown_enter__' ;
+  var InputChange = '__input_change__' ;
+  var InputBlur = '__input_blur__' ;
+  var InputFocus = '__input_focus__' ;
+  var MenuMouseLeave = '__menu_mouse_leave__' ;
+  var ItemMouseMove = '__item_mouse_move__' ;
+  var ItemClick = '__item_click__' ;
+  var ToggleButtonClick = '__togglebutton_click__' ;
+  var FunctionToggleMenu = '__function_toggle_menu__' ;
+  var FunctionOpenMenu = '__function_open_menu__' ;
+  var FunctionCloseMenu = '__function_close_menu__' ;
+  var FunctionSetHighlightedIndex = '__function_set_highlighted_index__' ;
+  var FunctionSelectItem = '__function_select_item__' ;
+  var FunctionSetInputValue = '__function_set_input_value__' ;
+  var FunctionReset$1 = '__function_reset__' ;
+  var ControlledPropUpdatedSelectedItem = '__controlled_prop_updated_selected_item__' ;
 
   var stateChangeTypes$1 = /*#__PURE__*/Object.freeze({
     __proto__: null,
@@ -4007,22 +3988,17 @@
   });
 
   function getInitialState$1(props) {
-    const initialState = getInitialState$2(props);
-    const {
-      selectedItem
-    } = initialState;
-    let {
-      inputValue
-    } = initialState;
+    var initialState = getInitialState$2(props);
+    var selectedItem = initialState.selectedItem;
+    var inputValue = initialState.inputValue;
     if (inputValue === '' && selectedItem && props.defaultInputValue === undefined && props.initialInputValue === undefined && props.inputValue === undefined) {
       inputValue = props.itemToString(selectedItem);
     }
-    return {
-      ...initialState,
-      inputValue
-    };
+    return _extends({}, initialState, {
+      inputValue: inputValue
+    });
   }
-  const propTypes$1 = {
+  var propTypes$1 = {
     items: PropTypes.array.isRequired,
     itemToString: PropTypes.func,
     getA11yStatusMessage: PropTypes.func,
@@ -4075,11 +4051,13 @@
    * @returns {Array} An array with the state and an action dispatcher.
    */
   function useControlledReducer(reducer, initialState, props) {
-    const previousSelectedItemRef = react.useRef();
-    const [state, dispatch] = useEnhancedReducer(reducer, initialState, props);
+    var previousSelectedItemRef = react.useRef();
+    var _useEnhancedReducer = useEnhancedReducer(reducer, initialState, props),
+      state = _useEnhancedReducer[0],
+      dispatch = _useEnhancedReducer[1];
 
     // ToDo: if needed, make same approach as selectedItemChanged from Downshift.
-    react.useEffect(() => {
+    react.useEffect(function () {
       if (isControlledProp(props, 'selectedItem')) {
         if (previousSelectedItemRef.current !== props.selectedItem) {
           dispatch({
@@ -4094,26 +4072,23 @@
   }
 
   // eslint-disable-next-line import/no-mutable-exports
-  let validatePropTypes$1 = noop;
+  var validatePropTypes$1 = noop;
   /* istanbul ignore next */
   {
-    validatePropTypes$1 = (options, caller) => {
+    validatePropTypes$1 = function validatePropTypes(options, caller) {
       PropTypes.checkPropTypes(propTypes$1, options, 'prop', caller.name);
     };
   }
-  const defaultProps$1 = {
-    ...defaultProps$3,
+  var defaultProps$1 = _extends({}, defaultProps$3, {
     getA11yStatusMessage: getA11yStatusMessage$1
-  };
+  });
 
   /* eslint-disable complexity */
   function downshiftUseComboboxReducer(state, action) {
-    const {
-      type,
-      props,
-      altKey
-    } = action;
-    let changes;
+    var type = action.type,
+      props = action.props,
+      altKey = action.altKey;
+    var changes;
     switch (type) {
       case ItemClick:
         changes = {
@@ -4138,14 +4113,13 @@
       case InputKeyDownArrowUp:
         if (state.isOpen) {
           if (altKey) {
-            changes = {
+            changes = _extends({
               isOpen: getDefaultValue$1(props, 'isOpen'),
-              highlightedIndex: getDefaultValue$1(props, 'highlightedIndex'),
-              ...(state.highlightedIndex >= 0 && {
-                selectedItem: props.items[state.highlightedIndex],
-                inputValue: props.itemToString(props.items[state.highlightedIndex])
-              })
-            };
+              highlightedIndex: getDefaultValue$1(props, 'highlightedIndex')
+            }, state.highlightedIndex >= 0 && {
+              selectedItem: props.items[state.highlightedIndex],
+              inputValue: props.itemToString(props.items[state.highlightedIndex])
+            });
           } else {
             changes = {
               highlightedIndex: getNextWrappingIndex(-1, state.highlightedIndex, props.items.length, action.getItemNodeFromIndex, true)
@@ -4159,24 +4133,22 @@
         }
         break;
       case InputKeyDownEnter:
-        changes = {
+        changes = _extends({
           isOpen: getDefaultValue$1(props, 'isOpen'),
-          highlightedIndex: getDefaultValue$1(props, 'highlightedIndex'),
-          ...(state.highlightedIndex >= 0 && {
-            selectedItem: props.items[state.highlightedIndex],
-            inputValue: props.itemToString(props.items[state.highlightedIndex])
-          })
-        };
+          highlightedIndex: getDefaultValue$1(props, 'highlightedIndex')
+        }, state.highlightedIndex >= 0 && {
+          selectedItem: props.items[state.highlightedIndex],
+          inputValue: props.itemToString(props.items[state.highlightedIndex])
+        });
         break;
       case InputKeyDownEscape:
-        changes = {
+        changes = _extends({
           isOpen: false,
-          highlightedIndex: -1,
-          ...(!state.isOpen && {
-            selectedItem: null,
-            inputValue: ''
-          })
-        };
+          highlightedIndex: -1
+        }, !state.isOpen && {
+          selectedItem: null,
+          inputValue: ''
+        });
         break;
       case InputKeyDownPageUp:
         changes = {
@@ -4199,14 +4171,13 @@
         };
         break;
       case InputBlur:
-        changes = {
+        changes = _extends({
           isOpen: false,
-          highlightedIndex: -1,
-          ...(state.highlightedIndex >= 0 && action.selectItem && {
-            selectedItem: props.items[state.highlightedIndex],
-            inputValue: props.itemToString(props.items[state.highlightedIndex])
-          })
-        };
+          highlightedIndex: -1
+        }, state.highlightedIndex >= 0 && action.selectItem && {
+          selectedItem: props.items[state.highlightedIndex],
+          inputValue: props.itemToString(props.items[state.highlightedIndex])
+        });
         break;
       case InputChange:
         changes = {
@@ -4235,14 +4206,14 @@
       default:
         return downshiftCommonReducer(state, action, stateChangeTypes$1);
     }
-    return {
-      ...state,
-      ...changes
-    };
+    return _extends({}, state, changes);
   }
   /* eslint-enable complexity */
 
-  /* eslint-disable max-statements */
+  var _excluded$1 = ["onMouseLeave", "refKey", "ref"],
+    _excluded2$1 = ["item", "index", "refKey", "ref", "onMouseMove", "onMouseDown", "onClick", "onPress", "disabled"],
+    _excluded3 = ["onClick", "onPress", "refKey", "ref"],
+    _excluded4 = ["onKeyDown", "onChange", "onInput", "onFocus", "onBlur", "onChangeText", "refKey", "ref"];
   useCombobox.stateChangeTypes = stateChangeTypes$1;
   function useCombobox(userProps) {
     if (userProps === void 0) {
@@ -4250,349 +4221,327 @@
     }
     validatePropTypes$1(userProps, useCombobox);
     // Props defaults and destructuring.
-    const props = {
-      ...defaultProps$1,
-      ...userProps
-    };
-    const {
-      initialIsOpen,
-      defaultIsOpen,
-      items,
-      scrollIntoView,
-      environment,
-      getA11yStatusMessage,
-      getA11ySelectionMessage,
-      itemToString
-    } = props;
+    var props = _extends({}, defaultProps$1, userProps);
+    var initialIsOpen = props.initialIsOpen,
+      defaultIsOpen = props.defaultIsOpen,
+      items = props.items,
+      scrollIntoView = props.scrollIntoView,
+      environment = props.environment,
+      getA11yStatusMessage = props.getA11yStatusMessage,
+      getA11ySelectionMessage = props.getA11ySelectionMessage,
+      itemToString = props.itemToString;
     // Initial state depending on controlled props.
-    const initialState = getInitialState$1(props);
-    const [state, dispatch] = useControlledReducer(downshiftUseComboboxReducer, initialState, props);
-    const {
-      isOpen,
-      highlightedIndex,
-      selectedItem,
-      inputValue
-    } = state;
+    var initialState = getInitialState$1(props);
+    var _useControlledReducer = useControlledReducer(downshiftUseComboboxReducer, initialState, props),
+      state = _useControlledReducer[0],
+      dispatch = _useControlledReducer[1];
+    var isOpen = state.isOpen,
+      highlightedIndex = state.highlightedIndex,
+      selectedItem = state.selectedItem,
+      inputValue = state.inputValue;
 
     // Element refs.
-    const menuRef = react.useRef(null);
-    const itemRefs = react.useRef({});
-    const inputRef = react.useRef(null);
-    const toggleButtonRef = react.useRef(null);
-    const isInitialMountRef = react.useRef(true);
+    var menuRef = react.useRef(null);
+    var itemRefs = react.useRef({});
+    var inputRef = react.useRef(null);
+    var toggleButtonRef = react.useRef(null);
+    var isInitialMountRef = react.useRef(true);
     // prevent id re-generation between renders.
-    const elementIds = useElementIds(props);
+    var elementIds = useElementIds(props);
     // used to keep track of how many items we had on previous cycle.
-    const previousResultCountRef = react.useRef();
+    var previousResultCountRef = react.useRef();
     // utility callback to get item element.
-    const latest = useLatestRef({
-      state,
-      props
+    var latest = useLatestRef({
+      state: state,
+      props: props
     });
-    const getItemNodeFromIndex = react.useCallback(index => itemRefs.current[elementIds.getItemId(index)], [elementIds]);
+    var getItemNodeFromIndex = react.useCallback(function (index) {
+      return itemRefs.current[elementIds.getItemId(index)];
+    }, [elementIds]);
 
     // Effects.
     // Sets a11y status message on changes in state.
-    useA11yMessageSetter(getA11yStatusMessage, [isOpen, highlightedIndex, inputValue, items], {
+    useA11yMessageSetter(getA11yStatusMessage, [isOpen, highlightedIndex, inputValue, items], _extends({
       isInitialMount: isInitialMountRef.current,
       previousResultCount: previousResultCountRef.current,
-      items,
-      environment,
-      itemToString,
-      ...state
-    });
+      items: items,
+      environment: environment,
+      itemToString: itemToString
+    }, state));
     // Sets a11y status message on changes in selectedItem.
-    useA11yMessageSetter(getA11ySelectionMessage, [selectedItem], {
+    useA11yMessageSetter(getA11ySelectionMessage, [selectedItem], _extends({
       isInitialMount: isInitialMountRef.current,
       previousResultCount: previousResultCountRef.current,
-      items,
-      environment,
-      itemToString,
-      ...state
-    });
+      items: items,
+      environment: environment,
+      itemToString: itemToString
+    }, state));
     // Scroll on highlighted item if change comes from keyboard.
-    const shouldScrollRef = useScrollIntoView({
+    var shouldScrollRef = useScrollIntoView({
       menuElement: menuRef.current,
-      highlightedIndex,
-      isOpen,
-      itemRefs,
-      scrollIntoView,
-      getItemNodeFromIndex
+      highlightedIndex: highlightedIndex,
+      isOpen: isOpen,
+      itemRefs: itemRefs,
+      scrollIntoView: scrollIntoView,
+      getItemNodeFromIndex: getItemNodeFromIndex
     });
     useControlPropsValidator({
       isInitialMount: isInitialMountRef.current,
-      props,
-      state
+      props: props,
+      state: state
     });
     // Focus the input on first render if required.
-    react.useEffect(() => {
-      const focusOnOpen = initialIsOpen || defaultIsOpen || isOpen;
+    react.useEffect(function () {
+      var focusOnOpen = initialIsOpen || defaultIsOpen || isOpen;
       if (focusOnOpen && inputRef.current) {
         inputRef.current.focus();
       }
       // eslint-disable-next-line react-hooks/exhaustive-deps
     }, []);
-    react.useEffect(() => {
+    react.useEffect(function () {
       if (isInitialMountRef.current) {
         return;
       }
       previousResultCountRef.current = items.length;
     });
     // Add mouse/touch events to document.
-    const mouseAndTouchTrackersRef = useMouseAndTouchTracker(isOpen, [inputRef, menuRef, toggleButtonRef], environment, () => {
+    var mouseAndTouchTrackersRef = useMouseAndTouchTracker(isOpen, [inputRef, menuRef, toggleButtonRef], environment, function () {
       dispatch({
         type: InputBlur,
         selectItem: false
       });
     });
-    const setGetterPropCallInfo = useGetterPropsCalledChecker('getInputProps', 'getMenuProps');
+    var setGetterPropCallInfo = useGetterPropsCalledChecker('getInputProps', 'getMenuProps');
     // Make initial ref false.
-    react.useEffect(() => {
+    react.useEffect(function () {
       isInitialMountRef.current = false;
-      return () => {
+      return function () {
         isInitialMountRef.current = true;
       };
     }, []);
     // Reset itemRefs on close.
-    react.useEffect(() => {
+    react.useEffect(function () {
       if (!isOpen) {
         itemRefs.current = {};
       } else if (document.activeElement !== inputRef.current) {
-        inputRef?.current?.focus();
+        var _inputRef$current;
+        inputRef == null ? void 0 : (_inputRef$current = inputRef.current) == null ? void 0 : _inputRef$current.focus();
       }
     }, [isOpen]);
 
     /* Event handler functions */
-    const inputKeyDownHandlers = react.useMemo(() => ({
-      ArrowDown(event) {
-        event.preventDefault();
-        dispatch({
-          type: InputKeyDownArrowDown,
-          altKey: event.altKey,
-          getItemNodeFromIndex
-        });
-      },
-      ArrowUp(event) {
-        event.preventDefault();
-        dispatch({
-          type: InputKeyDownArrowUp,
-          altKey: event.altKey,
-          getItemNodeFromIndex
-        });
-      },
-      Home(event) {
-        if (!latest.current.state.isOpen) {
-          return;
-        }
-        event.preventDefault();
-        dispatch({
-          type: InputKeyDownHome,
-          getItemNodeFromIndex
-        });
-      },
-      End(event) {
-        if (!latest.current.state.isOpen) {
-          return;
-        }
-        event.preventDefault();
-        dispatch({
-          type: InputKeyDownEnd,
-          getItemNodeFromIndex
-        });
-      },
-      Escape(event) {
-        const latestState = latest.current.state;
-        if (latestState.isOpen || latestState.inputValue || latestState.selectedItem || latestState.highlightedIndex > -1) {
+    var inputKeyDownHandlers = react.useMemo(function () {
+      return {
+        ArrowDown: function ArrowDown(event) {
           event.preventDefault();
           dispatch({
-            type: InputKeyDownEscape
+            type: InputKeyDownArrowDown,
+            altKey: event.altKey,
+            getItemNodeFromIndex: getItemNodeFromIndex
           });
-        }
-      },
-      Enter(event) {
-        const latestState = latest.current.state;
-        // if closed or no highlighted index, do nothing.
-        if (!latestState.isOpen || event.which === 229 // if IME composing, wait for next Enter keydown event.
-        ) {
-          return;
-        }
-        event.preventDefault();
-        dispatch({
-          type: InputKeyDownEnter,
-          getItemNodeFromIndex
-        });
-      },
-      PageUp(event) {
-        if (latest.current.state.isOpen) {
+        },
+        ArrowUp: function ArrowUp(event) {
           event.preventDefault();
           dispatch({
-            type: InputKeyDownPageUp,
-            getItemNodeFromIndex
+            type: InputKeyDownArrowUp,
+            altKey: event.altKey,
+            getItemNodeFromIndex: getItemNodeFromIndex
           });
-        }
-      },
-      PageDown(event) {
-        if (latest.current.state.isOpen) {
+        },
+        Home: function Home(event) {
+          if (!latest.current.state.isOpen) {
+            return;
+          }
+          event.preventDefault();
+          dispatch({
+            type: InputKeyDownHome,
+            getItemNodeFromIndex: getItemNodeFromIndex
+          });
+        },
+        End: function End(event) {
+          if (!latest.current.state.isOpen) {
+            return;
+          }
           event.preventDefault();
           dispatch({
-            type: InputKeyDownPageDown,
-            getItemNodeFromIndex
+            type: InputKeyDownEnd,
+            getItemNodeFromIndex: getItemNodeFromIndex
           });
+        },
+        Escape: function Escape(event) {
+          var latestState = latest.current.state;
+          if (latestState.isOpen || latestState.inputValue || latestState.selectedItem || latestState.highlightedIndex > -1) {
+            event.preventDefault();
+            dispatch({
+              type: InputKeyDownEscape
+            });
+          }
+        },
+        Enter: function Enter(event) {
+          var latestState = latest.current.state;
+          // if closed or no highlighted index, do nothing.
+          if (!latestState.isOpen || event.which === 229 // if IME composing, wait for next Enter keydown event.
+          ) {
+            return;
+          }
+          event.preventDefault();
+          dispatch({
+            type: InputKeyDownEnter,
+            getItemNodeFromIndex: getItemNodeFromIndex
+          });
+        },
+        PageUp: function PageUp(event) {
+          if (latest.current.state.isOpen) {
+            event.preventDefault();
+            dispatch({
+              type: InputKeyDownPageUp,
+              getItemNodeFromIndex: getItemNodeFromIndex
+            });
+          }
+        },
+        PageDown: function PageDown(event) {
+          if (latest.current.state.isOpen) {
+            event.preventDefault();
+            dispatch({
+              type: InputKeyDownPageDown,
+              getItemNodeFromIndex: getItemNodeFromIndex
+            });
+          }
         }
-      }
-    }), [dispatch, latest, getItemNodeFromIndex]);
+      };
+    }, [dispatch, latest, getItemNodeFromIndex]);
 
     // Getter props.
-    const getLabelProps = react.useCallback(labelProps => ({
-      id: elementIds.labelId,
-      htmlFor: elementIds.inputId,
-      ...labelProps
-    }), [elementIds]);
-    const getMenuProps = react.useCallback(function (_temp, _temp2) {
-      let {
-        onMouseLeave,
-        refKey = 'ref',
-        ref,
-        ...rest
-      } = _temp === void 0 ? {} : _temp;
-      let {
-        suppressRefError = false
-      } = _temp2 === void 0 ? {} : _temp2;
+    var getLabelProps = react.useCallback(function (labelProps) {
+      return _extends({
+        id: elementIds.labelId,
+        htmlFor: elementIds.inputId
+      }, labelProps);
+    }, [elementIds]);
+    var getMenuProps = react.useCallback(function (_temp, _temp2) {
+      var _extends2;
+      var _ref = _temp === void 0 ? {} : _temp,
+        onMouseLeave = _ref.onMouseLeave,
+        _ref$refKey = _ref.refKey,
+        refKey = _ref$refKey === void 0 ? 'ref' : _ref$refKey,
+        ref = _ref.ref,
+        rest = _objectWithoutPropertiesLoose(_ref, _excluded$1);
+      var _ref2 = _temp2 === void 0 ? {} : _temp2,
+        _ref2$suppressRefErro = _ref2.suppressRefError,
+        suppressRefError = _ref2$suppressRefErro === void 0 ? false : _ref2$suppressRefErro;
       setGetterPropCallInfo('getMenuProps', suppressRefError, refKey, menuRef);
-      return {
-        [refKey]: handleRefs(ref, menuNode => {
-          menuRef.current = menuNode;
-        }),
-        id: elementIds.menuId,
-        role: 'listbox',
-        'aria-labelledby': elementIds.labelId,
-        onMouseLeave: callAllEventHandlers(onMouseLeave, () => {
-          dispatch({
-            type: MenuMouseLeave
-          });
-        }),
-        ...rest
-      };
+      return _extends((_extends2 = {}, _extends2[refKey] = handleRefs(ref, function (menuNode) {
+        menuRef.current = menuNode;
+      }), _extends2.id = elementIds.menuId, _extends2.role = 'listbox', _extends2['aria-labelledby'] = elementIds.labelId, _extends2.onMouseLeave = callAllEventHandlers(onMouseLeave, function () {
+        dispatch({
+          type: MenuMouseLeave
+        });
+      }), _extends2), rest);
     }, [dispatch, setGetterPropCallInfo, elementIds]);
-    const getItemProps = react.useCallback(function (_temp3) {
-      let {
-        item,
-        index,
-        refKey = 'ref',
-        ref,
-        onMouseMove,
-        onMouseDown,
-        onClick,
-        onPress,
-        disabled,
-        ...rest
-      } = _temp3 === void 0 ? {} : _temp3;
-      const {
-        props: latestProps,
-        state: latestState
-      } = latest.current;
-      const itemIndex = getItemIndex(index, item, latestProps.items);
+    var getItemProps = react.useCallback(function (_temp3) {
+      var _extends3, _ref4;
+      var _ref3 = _temp3 === void 0 ? {} : _temp3,
+        item = _ref3.item,
+        index = _ref3.index,
+        _ref3$refKey = _ref3.refKey,
+        refKey = _ref3$refKey === void 0 ? 'ref' : _ref3$refKey,
+        ref = _ref3.ref,
+        onMouseMove = _ref3.onMouseMove,
+        onMouseDown = _ref3.onMouseDown,
+        onClick = _ref3.onClick;
+        _ref3.onPress;
+        var disabled = _ref3.disabled,
+        rest = _objectWithoutPropertiesLoose(_ref3, _excluded2$1);
+      var _latest$current = latest.current,
+        latestProps = _latest$current.props,
+        latestState = _latest$current.state;
+      var itemIndex = getItemIndex(index, item, latestProps.items);
       if (itemIndex < 0) {
         throw new Error('Pass either item or item index in getItemProps!');
       }
-      const onSelectKey = 'onClick';
-      const customClickHandler = onClick;
-      const itemHandleMouseMove = () => {
+      var onSelectKey = 'onClick';
+      var customClickHandler = onClick;
+      var itemHandleMouseMove = function itemHandleMouseMove() {
         if (index === latestState.highlightedIndex) {
           return;
         }
         shouldScrollRef.current = false;
         dispatch({
           type: ItemMouseMove,
-          index,
-          disabled
+          index: index,
+          disabled: disabled
         });
       };
-      const itemHandleClick = () => {
+      var itemHandleClick = function itemHandleClick() {
         dispatch({
           type: ItemClick,
-          index
+          index: index
         });
       };
-      const itemHandleMouseDown = e => e.preventDefault();
-      return {
-        [refKey]: handleRefs(ref, itemNode => {
-          if (itemNode) {
-            itemRefs.current[elementIds.getItemId(itemIndex)] = itemNode;
-          }
-        }),
-        disabled,
-        role: 'option',
-        'aria-selected': `${itemIndex === latestState.highlightedIndex}`,
-        id: elementIds.getItemId(itemIndex),
-        ...(!disabled && {
-          [onSelectKey]: callAllEventHandlers(customClickHandler, itemHandleClick)
-        }),
-        onMouseMove: callAllEventHandlers(onMouseMove, itemHandleMouseMove),
-        onMouseDown: callAllEventHandlers(onMouseDown, itemHandleMouseDown),
-        ...rest
+      var itemHandleMouseDown = function itemHandleMouseDown(e) {
+        return e.preventDefault();
       };
+      return _extends((_extends3 = {}, _extends3[refKey] = handleRefs(ref, function (itemNode) {
+        if (itemNode) {
+          itemRefs.current[elementIds.getItemId(itemIndex)] = itemNode;
+        }
+      }), _extends3.disabled = disabled, _extends3.role = 'option', _extends3['aria-selected'] = "" + (itemIndex === latestState.highlightedIndex), _extends3.id = elementIds.getItemId(itemIndex), _extends3), !disabled && (_ref4 = {}, _ref4[onSelectKey] = callAllEventHandlers(customClickHandler, itemHandleClick), _ref4), {
+        onMouseMove: callAllEventHandlers(onMouseMove, itemHandleMouseMove),
+        onMouseDown: callAllEventHandlers(onMouseDown, itemHandleMouseDown)
+      }, rest);
     }, [dispatch, latest, shouldScrollRef, elementIds]);
-    const getToggleButtonProps = react.useCallback(function (_temp4) {
-      let {
-        onClick,
-        onPress,
-        refKey = 'ref',
-        ref,
-        ...rest
-      } = _temp4 === void 0 ? {} : _temp4;
-      const latestState = latest.current.state;
-      const toggleButtonHandleClick = () => {
+    var getToggleButtonProps = react.useCallback(function (_temp4) {
+      var _extends4;
+      var _ref5 = _temp4 === void 0 ? {} : _temp4,
+        onClick = _ref5.onClick;
+        _ref5.onPress;
+        var _ref5$refKey = _ref5.refKey,
+        refKey = _ref5$refKey === void 0 ? 'ref' : _ref5$refKey,
+        ref = _ref5.ref,
+        rest = _objectWithoutPropertiesLoose(_ref5, _excluded3);
+      var latestState = latest.current.state;
+      var toggleButtonHandleClick = function toggleButtonHandleClick() {
         dispatch({
           type: ToggleButtonClick
         });
       };
-      return {
-        [refKey]: handleRefs(ref, toggleButtonNode => {
-          toggleButtonRef.current = toggleButtonNode;
-        }),
-        'aria-controls': elementIds.menuId,
-        'aria-expanded': latestState.isOpen,
-        id: elementIds.toggleButtonId,
-        tabIndex: -1,
-        ...(!rest.disabled && {
-          ...({
-            onClick: callAllEventHandlers(onClick, toggleButtonHandleClick)
-          })
-        }),
-        ...rest
-      };
+      return _extends((_extends4 = {}, _extends4[refKey] = handleRefs(ref, function (toggleButtonNode) {
+        toggleButtonRef.current = toggleButtonNode;
+      }), _extends4['aria-controls'] = elementIds.menuId, _extends4['aria-expanded'] = latestState.isOpen, _extends4.id = elementIds.toggleButtonId, _extends4.tabIndex = -1, _extends4), !rest.disabled && _extends({}, {
+        onClick: callAllEventHandlers(onClick, toggleButtonHandleClick)
+      }), rest);
     }, [dispatch, latest, elementIds]);
-    const getInputProps = react.useCallback(function (_temp5, _temp6) {
-      let {
-        onKeyDown,
-        onChange,
-        onInput,
-        onFocus,
-        onBlur,
-        onChangeText,
-        refKey = 'ref',
-        ref,
-        ...rest
-      } = _temp5 === void 0 ? {} : _temp5;
-      let {
-        suppressRefError = false
-      } = _temp6 === void 0 ? {} : _temp6;
+    var getInputProps = react.useCallback(function (_temp5, _temp6) {
+      var _extends5;
+      var _ref6 = _temp5 === void 0 ? {} : _temp5,
+        onKeyDown = _ref6.onKeyDown,
+        onChange = _ref6.onChange,
+        onInput = _ref6.onInput,
+        onFocus = _ref6.onFocus,
+        onBlur = _ref6.onBlur;
+        _ref6.onChangeText;
+        var _ref6$refKey = _ref6.refKey,
+        refKey = _ref6$refKey === void 0 ? 'ref' : _ref6$refKey,
+        ref = _ref6.ref,
+        rest = _objectWithoutPropertiesLoose(_ref6, _excluded4);
+      var _ref7 = _temp6 === void 0 ? {} : _temp6,
+        _ref7$suppressRefErro = _ref7.suppressRefError,
+        suppressRefError = _ref7$suppressRefErro === void 0 ? false : _ref7$suppressRefErro;
       setGetterPropCallInfo('getInputProps', suppressRefError, refKey, inputRef);
-      const latestState = latest.current.state;
-      const inputHandleKeyDown = event => {
-        const key = normalizeArrowKey(event);
+      var latestState = latest.current.state;
+      var inputHandleKeyDown = function inputHandleKeyDown(event) {
+        var key = normalizeArrowKey(event);
         if (key && inputKeyDownHandlers[key]) {
           inputKeyDownHandlers[key](event);
         }
       };
-      const inputHandleChange = event => {
+      var inputHandleChange = function inputHandleChange(event) {
         dispatch({
           type: InputChange,
           inputValue: event.target.value
         });
       };
-      const inputHandleBlur = () => {
+      var inputHandleBlur = function inputHandleBlur() {
         /* istanbul ignore else */
         if (latestState.isOpen && !mouseAndTouchTrackersRef.current.isMouseDown) {
           dispatch({
@@ -4601,7 +4550,7 @@
           });
         }
       };
-      const inputHandleFocus = () => {
+      var inputHandleFocus = function inputHandleFocus() {
         if (!latestState.isOpen) {
           dispatch({
             type: InputFocus
@@ -4610,99 +4559,80 @@
       };
 
       /* istanbul ignore next (preact) */
-      const onChangeKey = 'onChange';
-      let eventHandlers = {};
+      var onChangeKey = 'onChange';
+      var eventHandlers = {};
       if (!rest.disabled) {
-        eventHandlers = {
-          [onChangeKey]: callAllEventHandlers(onChange, onInput, inputHandleChange),
-          onKeyDown: callAllEventHandlers(onKeyDown, inputHandleKeyDown),
-          onBlur: callAllEventHandlers(onBlur, inputHandleBlur),
-          onFocus: callAllEventHandlers(onFocus, inputHandleFocus)
-        };
+        var _eventHandlers;
+        eventHandlers = (_eventHandlers = {}, _eventHandlers[onChangeKey] = callAllEventHandlers(onChange, onInput, inputHandleChange), _eventHandlers.onKeyDown = callAllEventHandlers(onKeyDown, inputHandleKeyDown), _eventHandlers.onBlur = callAllEventHandlers(onBlur, inputHandleBlur), _eventHandlers.onFocus = callAllEventHandlers(onFocus, inputHandleFocus), _eventHandlers);
       }
-      return {
-        [refKey]: handleRefs(ref, inputNode => {
-          inputRef.current = inputNode;
-        }),
-        'aria-activedescendant': latestState.isOpen && latestState.highlightedIndex > -1 ? elementIds.getItemId(latestState.highlightedIndex) : '',
-        'aria-autocomplete': 'list',
-        'aria-controls': elementIds.menuId,
-        'aria-expanded': latestState.isOpen,
-        'aria-labelledby': elementIds.labelId,
-        // https://developer.mozilla.org/en-US/docs/Web/Security/Securing_your_site/Turning_off_form_autocompletion
-        // revert back since autocomplete="nope" is ignored on latest Chrome and Opera
-        autoComplete: 'off',
-        id: elementIds.inputId,
-        role: 'combobox',
-        value: latestState.inputValue,
-        ...eventHandlers,
-        ...rest
-      };
+      return _extends((_extends5 = {}, _extends5[refKey] = handleRefs(ref, function (inputNode) {
+        inputRef.current = inputNode;
+      }), _extends5['aria-activedescendant'] = latestState.isOpen && latestState.highlightedIndex > -1 ? elementIds.getItemId(latestState.highlightedIndex) : '', _extends5['aria-autocomplete'] = 'list', _extends5['aria-controls'] = elementIds.menuId, _extends5['aria-expanded'] = latestState.isOpen, _extends5['aria-labelledby'] = elementIds.labelId, _extends5.autoComplete = 'off', _extends5.id = elementIds.inputId, _extends5.role = 'combobox', _extends5.value = latestState.inputValue, _extends5), eventHandlers, rest);
     }, [dispatch, inputKeyDownHandlers, latest, mouseAndTouchTrackersRef, setGetterPropCallInfo, elementIds]);
 
     // returns
-    const toggleMenu = react.useCallback(() => {
+    var toggleMenu = react.useCallback(function () {
       dispatch({
         type: FunctionToggleMenu
       });
     }, [dispatch]);
-    const closeMenu = react.useCallback(() => {
+    var closeMenu = react.useCallback(function () {
       dispatch({
         type: FunctionCloseMenu
       });
     }, [dispatch]);
-    const openMenu = react.useCallback(() => {
+    var openMenu = react.useCallback(function () {
       dispatch({
         type: FunctionOpenMenu
       });
     }, [dispatch]);
-    const setHighlightedIndex = react.useCallback(newHighlightedIndex => {
+    var setHighlightedIndex = react.useCallback(function (newHighlightedIndex) {
       dispatch({
         type: FunctionSetHighlightedIndex,
         highlightedIndex: newHighlightedIndex
       });
     }, [dispatch]);
-    const selectItem = react.useCallback(newSelectedItem => {
+    var selectItem = react.useCallback(function (newSelectedItem) {
       dispatch({
         type: FunctionSelectItem,
         selectedItem: newSelectedItem
       });
     }, [dispatch]);
-    const setInputValue = react.useCallback(newInputValue => {
+    var setInputValue = react.useCallback(function (newInputValue) {
       dispatch({
         type: FunctionSetInputValue,
         inputValue: newInputValue
       });
     }, [dispatch]);
-    const reset = react.useCallback(() => {
+    var reset = react.useCallback(function () {
       dispatch({
         type: FunctionReset$1
       });
     }, [dispatch]);
     return {
       // prop getters.
-      getItemProps,
-      getLabelProps,
-      getMenuProps,
-      getInputProps,
-      getToggleButtonProps,
+      getItemProps: getItemProps,
+      getLabelProps: getLabelProps,
+      getMenuProps: getMenuProps,
+      getInputProps: getInputProps,
+      getToggleButtonProps: getToggleButtonProps,
       // actions.
-      toggleMenu,
-      openMenu,
-      closeMenu,
-      setHighlightedIndex,
-      setInputValue,
-      selectItem,
-      reset,
+      toggleMenu: toggleMenu,
+      openMenu: openMenu,
+      closeMenu: closeMenu,
+      setHighlightedIndex: setHighlightedIndex,
+      setInputValue: setInputValue,
+      selectItem: selectItem,
+      reset: reset,
       // state.
-      highlightedIndex,
-      isOpen,
-      selectedItem,
-      inputValue
+      highlightedIndex: highlightedIndex,
+      isOpen: isOpen,
+      selectedItem: selectedItem,
+      inputValue: inputValue
     };
   }
 
-  const defaultStateValues = {
+  var defaultStateValues = {
     activeIndex: -1,
     selectedItems: []
   };
@@ -4740,11 +4670,11 @@
    * @returns {Object} The initial state.
    */
   function getInitialState(props) {
-    const activeIndex = getInitialValue(props, 'activeIndex');
-    const selectedItems = getInitialValue(props, 'selectedItems');
+    var activeIndex = getInitialValue(props, 'activeIndex');
+    var selectedItems = getInitialValue(props, 'selectedItems');
     return {
-      activeIndex,
-      selectedItems
+      activeIndex: activeIndex,
+      selectedItems: selectedItems
     };
   }
 
@@ -4761,7 +4691,7 @@
     if (event.shiftKey || event.metaKey || event.ctrlKey || event.altKey) {
       return false;
     }
-    const element = event.target;
+    var element = event.target;
     if (element instanceof HTMLInputElement &&
     // if element is a text input
     element.value !== '' && (
@@ -4780,13 +4710,11 @@
    * @returns {string} The a11y message.
    */
   function getA11yRemovalMessage(selectionParameters) {
-    const {
-      removedSelectedItem,
-      itemToString: itemToStringLocal
-    } = selectionParameters;
-    return `${itemToStringLocal(removedSelectedItem)} has been removed.`;
+    var removedSelectedItem = selectionParameters.removedSelectedItem,
+      itemToStringLocal = selectionParameters.itemToString;
+    return itemToStringLocal(removedSelectedItem) + " has been removed.";
   }
-  const propTypes = {
+  var propTypes = {
     selectedItems: PropTypes.array,
     initialSelectedItems: PropTypes.array,
     defaultSelectedItems: PropTypes.array,
@@ -4810,37 +4738,37 @@
       })
     })
   };
-  const defaultProps = {
+  var defaultProps = {
     itemToString: defaultProps$3.itemToString,
     stateReducer: defaultProps$3.stateReducer,
     environment: defaultProps$3.environment,
-    getA11yRemovalMessage,
+    getA11yRemovalMessage: getA11yRemovalMessage,
     keyNavigationNext: 'ArrowRight',
     keyNavigationPrevious: 'ArrowLeft'
   };
 
   // eslint-disable-next-line import/no-mutable-exports
-  let validatePropTypes = noop;
+  var validatePropTypes = noop;
   /* istanbul ignore next */
   {
-    validatePropTypes = (options, caller) => {
+    validatePropTypes = function validatePropTypes(options, caller) {
       PropTypes.checkPropTypes(propTypes, options, 'prop', caller.name);
     };
   }
 
-  const SelectedItemClick = '__selected_item_click__' ;
-  const SelectedItemKeyDownDelete = '__selected_item_keydown_delete__' ;
-  const SelectedItemKeyDownBackspace = '__selected_item_keydown_backspace__' ;
-  const SelectedItemKeyDownNavigationNext = '__selected_item_keydown_navigation_next__' ;
-  const SelectedItemKeyDownNavigationPrevious = '__selected_item_keydown_navigation_previous__' ;
-  const DropdownKeyDownNavigationPrevious = '__dropdown_keydown_navigation_previous__' ;
-  const DropdownKeyDownBackspace = '__dropdown_keydown_backspace__' ;
-  const DropdownClick = '__dropdown_click__' ;
-  const FunctionAddSelectedItem = '__function_add_selected_item__' ;
-  const FunctionRemoveSelectedItem = '__function_remove_selected_item__' ;
-  const FunctionSetSelectedItems = '__function_set_selected_items__' ;
-  const FunctionSetActiveIndex = '__function_set_active_index__' ;
-  const FunctionReset = '__function_reset__' ;
+  var SelectedItemClick = '__selected_item_click__' ;
+  var SelectedItemKeyDownDelete = '__selected_item_keydown_delete__' ;
+  var SelectedItemKeyDownBackspace = '__selected_item_keydown_backspace__' ;
+  var SelectedItemKeyDownNavigationNext = '__selected_item_keydown_navigation_next__' ;
+  var SelectedItemKeyDownNavigationPrevious = '__selected_item_keydown_navigation_previous__' ;
+  var DropdownKeyDownNavigationPrevious = '__dropdown_keydown_navigation_previous__' ;
+  var DropdownKeyDownBackspace = '__dropdown_keydown_backspace__' ;
+  var DropdownClick = '__dropdown_click__' ;
+  var FunctionAddSelectedItem = '__function_add_selected_item__' ;
+  var FunctionRemoveSelectedItem = '__function_remove_selected_item__' ;
+  var FunctionSetSelectedItems = '__function_set_selected_items__' ;
+  var FunctionSetActiveIndex = '__function_set_active_index__' ;
+  var FunctionReset = '__function_reset__' ;
 
   var stateChangeTypes = /*#__PURE__*/Object.freeze({
     __proto__: null,
@@ -4861,17 +4789,13 @@
 
   /* eslint-disable complexity */
   function downshiftMultipleSelectionReducer(state, action) {
-    const {
-      type,
-      index,
-      props,
-      selectedItem
-    } = action;
-    const {
-      activeIndex,
-      selectedItems
-    } = state;
-    let changes;
+    var type = action.type,
+      index = action.index,
+      props = action.props,
+      selectedItem = action.selectedItem;
+    var activeIndex = state.activeIndex,
+      selectedItems = state.selectedItems;
+    var changes;
     switch (type) {
       case SelectedItemClick:
         changes = {
@@ -4894,18 +4818,17 @@
           if (activeIndex < 0) {
             break;
           }
-          let newActiveIndex = activeIndex;
+          var newActiveIndex = activeIndex;
           if (selectedItems.length === 1) {
             newActiveIndex = -1;
           } else if (activeIndex === selectedItems.length - 1) {
             newActiveIndex = selectedItems.length - 2;
           }
-          changes = {
-            selectedItems: [...selectedItems.slice(0, activeIndex), ...selectedItems.slice(activeIndex + 1)],
-            ...{
-              activeIndex: newActiveIndex
-            }
-          };
+          changes = _extends({
+            selectedItems: [].concat(selectedItems.slice(0, activeIndex), selectedItems.slice(activeIndex + 1))
+          }, {
+            activeIndex: newActiveIndex
+          });
           break;
         }
       case DropdownKeyDownNavigationPrevious:
@@ -4920,7 +4843,7 @@
         break;
       case FunctionAddSelectedItem:
         changes = {
-          selectedItems: [...selectedItems, selectedItem]
+          selectedItems: [].concat(selectedItems, [selectedItem])
         };
         break;
       case DropdownClick:
@@ -4930,27 +4853,25 @@
         break;
       case FunctionRemoveSelectedItem:
         {
-          let newActiveIndex = activeIndex;
-          const selectedItemIndex = selectedItems.indexOf(selectedItem);
+          var _newActiveIndex = activeIndex;
+          var selectedItemIndex = selectedItems.indexOf(selectedItem);
           if (selectedItemIndex < 0) {
             break;
           }
           if (selectedItems.length === 1) {
-            newActiveIndex = -1;
+            _newActiveIndex = -1;
           } else if (selectedItemIndex === selectedItems.length - 1) {
-            newActiveIndex = selectedItems.length - 2;
+            _newActiveIndex = selectedItems.length - 2;
           }
           changes = {
-            selectedItems: [...selectedItems.slice(0, selectedItemIndex), ...selectedItems.slice(selectedItemIndex + 1)],
-            activeIndex: newActiveIndex
+            selectedItems: [].concat(selectedItems.slice(0, selectedItemIndex), selectedItems.slice(selectedItemIndex + 1)),
+            activeIndex: _newActiveIndex
           };
           break;
         }
       case FunctionSetSelectedItems:
         {
-          const {
-            selectedItems: newSelectedItems
-          } = action;
+          var newSelectedItems = action.selectedItems;
           changes = {
             selectedItems: newSelectedItems
           };
@@ -4958,11 +4879,9 @@
         }
       case FunctionSetActiveIndex:
         {
-          const {
-            activeIndex: newActiveIndex
-          } = action;
+          var _newActiveIndex2 = action.activeIndex;
           changes = {
-            activeIndex: newActiveIndex
+            activeIndex: _newActiveIndex2
           };
           break;
         }
@@ -4975,12 +4894,11 @@
       default:
         throw new Error('Reducer called without proper action type.');
     }
-    return {
-      ...state,
-      ...changes
-    };
+    return _extends({}, state, changes);
   }
 
+  var _excluded = ["refKey", "ref", "onClick", "onKeyDown", "selectedItem", "index"],
+    _excluded2 = ["refKey", "ref", "onKeyDown", "onClick", "preventKeyAction"];
   useMultipleSelection.stateChangeTypes = stateChangeTypes;
   function useMultipleSelection(userProps) {
     if (userProps === void 0) {
@@ -4988,49 +4906,46 @@
     }
     validatePropTypes(userProps, useMultipleSelection);
     // Props defaults and destructuring.
-    const props = {
-      ...defaultProps,
-      ...userProps
-    };
-    const {
-      getA11yRemovalMessage,
-      itemToString,
-      environment,
-      keyNavigationNext,
-      keyNavigationPrevious
-    } = props;
+    var props = _extends({}, defaultProps, userProps);
+    var getA11yRemovalMessage = props.getA11yRemovalMessage,
+      itemToString = props.itemToString,
+      environment = props.environment,
+      keyNavigationNext = props.keyNavigationNext,
+      keyNavigationPrevious = props.keyNavigationPrevious;
 
     // Reducer init.
-    const [state, dispatch] = useControlledReducer$1(downshiftMultipleSelectionReducer, getInitialState(props), props);
-    const {
-      activeIndex,
-      selectedItems
-    } = state;
+    var _useControlledReducer = useControlledReducer$1(downshiftMultipleSelectionReducer, getInitialState(props), props),
+      state = _useControlledReducer[0],
+      dispatch = _useControlledReducer[1];
+    var activeIndex = state.activeIndex,
+      selectedItems = state.selectedItems;
 
     // Refs.
-    const isInitialMountRef = react.useRef(true);
-    const dropdownRef = react.useRef(null);
-    const previousSelectedItemsRef = react.useRef(selectedItems);
-    const selectedItemRefs = react.useRef();
+    var isInitialMountRef = react.useRef(true);
+    var dropdownRef = react.useRef(null);
+    var previousSelectedItemsRef = react.useRef(selectedItems);
+    var selectedItemRefs = react.useRef();
     selectedItemRefs.current = [];
-    const latest = useLatestRef({
-      state,
-      props
+    var latest = useLatestRef({
+      state: state,
+      props: props
     });
 
     // Effects.
     /* Sets a11y status message on changes in selectedItem. */
-    react.useEffect(() => {
+    react.useEffect(function () {
       if (isInitialMountRef.current) {
         return;
       }
       if (selectedItems.length < previousSelectedItemsRef.current.length) {
-        const removedSelectedItem = previousSelectedItemsRef.current.find(item => selectedItems.indexOf(item) < 0);
+        var removedSelectedItem = previousSelectedItemsRef.current.find(function (item) {
+          return selectedItems.indexOf(item) < 0;
+        });
         setStatus(getA11yRemovalMessage({
-          itemToString,
+          itemToString: itemToString,
           resultCount: selectedItems.length,
-          removedSelectedItem,
-          activeIndex,
+          removedSelectedItem: removedSelectedItem,
+          activeIndex: activeIndex,
           activeSelectedItem: selectedItems[activeIndex]
         }), environment.document);
       }
@@ -5039,7 +4954,7 @@
       // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [selectedItems.length]);
     // Sets focus on active item.
-    react.useEffect(() => {
+    react.useEffect(function () {
       if (isInitialMountRef.current) {
         return;
       }
@@ -5051,178 +4966,167 @@
     }, [activeIndex]);
     useControlPropsValidator({
       isInitialMount: isInitialMountRef.current,
-      props,
-      state
+      props: props,
+      state: state
     });
-    const setGetterPropCallInfo = useGetterPropsCalledChecker('getDropdownProps');
+    var setGetterPropCallInfo = useGetterPropsCalledChecker('getDropdownProps');
     // Make initial ref false.
-    react.useEffect(() => {
+    react.useEffect(function () {
       isInitialMountRef.current = false;
-      return () => {
+      return function () {
         isInitialMountRef.current = true;
       };
     }, []);
 
     // Event handler functions.
-    const selectedItemKeyDownHandlers = react.useMemo(() => ({
-      [keyNavigationPrevious]() {
+    var selectedItemKeyDownHandlers = react.useMemo(function () {
+      var _ref;
+      return _ref = {}, _ref[keyNavigationPrevious] = function () {
         dispatch({
           type: SelectedItemKeyDownNavigationPrevious
         });
-      },
-      [keyNavigationNext]() {
+      }, _ref[keyNavigationNext] = function () {
         dispatch({
           type: SelectedItemKeyDownNavigationNext
         });
-      },
-      Delete() {
+      }, _ref.Delete = function Delete() {
         dispatch({
           type: SelectedItemKeyDownDelete
         });
-      },
-      Backspace() {
+      }, _ref.Backspace = function Backspace() {
         dispatch({
           type: SelectedItemKeyDownBackspace
         });
-      }
-    }), [dispatch, keyNavigationNext, keyNavigationPrevious]);
-    const dropdownKeyDownHandlers = react.useMemo(() => ({
-      [keyNavigationPrevious](event) {
+      }, _ref;
+    }, [dispatch, keyNavigationNext, keyNavigationPrevious]);
+    var dropdownKeyDownHandlers = react.useMemo(function () {
+      var _ref2;
+      return _ref2 = {}, _ref2[keyNavigationPrevious] = function (event) {
         if (isKeyDownOperationPermitted(event)) {
           dispatch({
             type: DropdownKeyDownNavigationPrevious
           });
         }
-      },
-      Backspace(event) {
+      }, _ref2.Backspace = function Backspace(event) {
         if (isKeyDownOperationPermitted(event)) {
           dispatch({
             type: DropdownKeyDownBackspace
           });
         }
-      }
-    }), [dispatch, keyNavigationPrevious]);
+      }, _ref2;
+    }, [dispatch, keyNavigationPrevious]);
 
     // Getter props.
-    const getSelectedItemProps = react.useCallback(function (_temp) {
-      let {
-        refKey = 'ref',
-        ref,
-        onClick,
-        onKeyDown,
-        selectedItem,
-        index,
-        ...rest
-      } = _temp === void 0 ? {} : _temp;
-      const {
-        state: latestState
-      } = latest.current;
-      const itemIndex = getItemIndex(index, selectedItem, latestState.selectedItems);
+    var getSelectedItemProps = react.useCallback(function (_temp) {
+      var _extends2;
+      var _ref3 = _temp === void 0 ? {} : _temp,
+        _ref3$refKey = _ref3.refKey,
+        refKey = _ref3$refKey === void 0 ? 'ref' : _ref3$refKey,
+        ref = _ref3.ref,
+        onClick = _ref3.onClick,
+        onKeyDown = _ref3.onKeyDown,
+        selectedItem = _ref3.selectedItem,
+        index = _ref3.index,
+        rest = _objectWithoutPropertiesLoose(_ref3, _excluded);
+      var latestState = latest.current.state;
+      var itemIndex = getItemIndex(index, selectedItem, latestState.selectedItems);
       if (itemIndex < 0) {
         throw new Error('Pass either selectedItem or index in getSelectedItemProps!');
       }
-      const selectedItemHandleClick = () => {
+      var selectedItemHandleClick = function selectedItemHandleClick() {
         dispatch({
           type: SelectedItemClick,
-          index
+          index: index
         });
       };
-      const selectedItemHandleKeyDown = event => {
-        const key = normalizeArrowKey(event);
+      var selectedItemHandleKeyDown = function selectedItemHandleKeyDown(event) {
+        var key = normalizeArrowKey(event);
         if (key && selectedItemKeyDownHandlers[key]) {
           selectedItemKeyDownHandlers[key](event);
         }
       };
-      return {
-        [refKey]: handleRefs(ref, selectedItemNode => {
-          if (selectedItemNode) {
-            selectedItemRefs.current.push(selectedItemNode);
-          }
-        }),
-        tabIndex: index === latestState.activeIndex ? 0 : -1,
-        onClick: callAllEventHandlers(onClick, selectedItemHandleClick),
-        onKeyDown: callAllEventHandlers(onKeyDown, selectedItemHandleKeyDown),
-        ...rest
-      };
+      return _extends((_extends2 = {}, _extends2[refKey] = handleRefs(ref, function (selectedItemNode) {
+        if (selectedItemNode) {
+          selectedItemRefs.current.push(selectedItemNode);
+        }
+      }), _extends2.tabIndex = index === latestState.activeIndex ? 0 : -1, _extends2.onClick = callAllEventHandlers(onClick, selectedItemHandleClick), _extends2.onKeyDown = callAllEventHandlers(onKeyDown, selectedItemHandleKeyDown), _extends2), rest);
     }, [dispatch, latest, selectedItemKeyDownHandlers]);
-    const getDropdownProps = react.useCallback(function (_temp2, _temp3) {
-      let {
-        refKey = 'ref',
-        ref,
-        onKeyDown,
-        onClick,
-        preventKeyAction = false,
-        ...rest
-      } = _temp2 === void 0 ? {} : _temp2;
-      let {
-        suppressRefError = false
-      } = _temp3 === void 0 ? {} : _temp3;
+    var getDropdownProps = react.useCallback(function (_temp2, _temp3) {
+      var _extends3;
+      var _ref4 = _temp2 === void 0 ? {} : _temp2,
+        _ref4$refKey = _ref4.refKey,
+        refKey = _ref4$refKey === void 0 ? 'ref' : _ref4$refKey,
+        ref = _ref4.ref,
+        onKeyDown = _ref4.onKeyDown,
+        onClick = _ref4.onClick,
+        _ref4$preventKeyActio = _ref4.preventKeyAction,
+        preventKeyAction = _ref4$preventKeyActio === void 0 ? false : _ref4$preventKeyActio,
+        rest = _objectWithoutPropertiesLoose(_ref4, _excluded2);
+      var _ref5 = _temp3 === void 0 ? {} : _temp3,
+        _ref5$suppressRefErro = _ref5.suppressRefError,
+        suppressRefError = _ref5$suppressRefErro === void 0 ? false : _ref5$suppressRefErro;
       setGetterPropCallInfo('getDropdownProps', suppressRefError, refKey, dropdownRef);
-      const dropdownHandleKeyDown = event => {
-        const key = normalizeArrowKey(event);
+      var dropdownHandleKeyDown = function dropdownHandleKeyDown(event) {
+        var key = normalizeArrowKey(event);
         if (key && dropdownKeyDownHandlers[key]) {
           dropdownKeyDownHandlers[key](event);
         }
       };
-      const dropdownHandleClick = () => {
+      var dropdownHandleClick = function dropdownHandleClick() {
         dispatch({
           type: DropdownClick
         });
       };
-      return {
-        [refKey]: handleRefs(ref, dropdownNode => {
-          if (dropdownNode) {
-            dropdownRef.current = dropdownNode;
-          }
-        }),
-        ...(!preventKeyAction && {
-          onKeyDown: callAllEventHandlers(onKeyDown, dropdownHandleKeyDown),
-          onClick: callAllEventHandlers(onClick, dropdownHandleClick)
-        }),
-        ...rest
-      };
+      return _extends((_extends3 = {}, _extends3[refKey] = handleRefs(ref, function (dropdownNode) {
+        if (dropdownNode) {
+          dropdownRef.current = dropdownNode;
+        }
+      }), _extends3), !preventKeyAction && {
+        onKeyDown: callAllEventHandlers(onKeyDown, dropdownHandleKeyDown),
+        onClick: callAllEventHandlers(onClick, dropdownHandleClick)
+      }, rest);
     }, [dispatch, dropdownKeyDownHandlers, setGetterPropCallInfo]);
 
     // returns
-    const addSelectedItem = react.useCallback(selectedItem => {
+    var addSelectedItem = react.useCallback(function (selectedItem) {
       dispatch({
         type: FunctionAddSelectedItem,
-        selectedItem
+        selectedItem: selectedItem
       });
     }, [dispatch]);
-    const removeSelectedItem = react.useCallback(selectedItem => {
+    var removeSelectedItem = react.useCallback(function (selectedItem) {
       dispatch({
         type: FunctionRemoveSelectedItem,
-        selectedItem
+        selectedItem: selectedItem
       });
     }, [dispatch]);
-    const setSelectedItems = react.useCallback(newSelectedItems => {
+    var setSelectedItems = react.useCallback(function (newSelectedItems) {
       dispatch({
         type: FunctionSetSelectedItems,
         selectedItems: newSelectedItems
       });
     }, [dispatch]);
-    const setActiveIndex = react.useCallback(newActiveIndex => {
+    var setActiveIndex = react.useCallback(function (newActiveIndex) {
       dispatch({
         type: FunctionSetActiveIndex,
         activeIndex: newActiveIndex
       });
     }, [dispatch]);
-    const reset = react.useCallback(() => {
+    var reset = react.useCallback(function () {
       dispatch({
         type: FunctionReset
       });
     }, [dispatch]);
     return {
-      getSelectedItemProps,
-      getDropdownProps,
-      addSelectedItem,
-      removeSelectedItem,
-      setSelectedItems,
-      setActiveIndex,
-      reset,
-      selectedItems,
-      activeIndex
+      getSelectedItemProps: getSelectedItemProps,
+      getDropdownProps: getDropdownProps,
+      addSelectedItem: addSelectedItem,
+      removeSelectedItem: removeSelectedItem,
+      setSelectedItems: setSelectedItems,
+      setActiveIndex: setActiveIndex,
+      reset: reset,
+      selectedItems: selectedItems,
+      activeIndex: activeIndex
     };
   }