downshift 7.1.3-alpha.0 → 7.2.0

package/dist/downshift.esm.js

@@ -1,10 +1,14 @@
+import _objectWithoutPropertiesLoose from '@babel/runtime/helpers/esm/objectWithoutPropertiesLoose';
+import _extends from '@babel/runtime/helpers/esm/extends';
+import _assertThisInitialized from '@babel/runtime/helpers/esm/assertThisInitialized';
+import _inheritsLoose from '@babel/runtime/helpers/esm/inheritsLoose';
 import PropTypes from 'prop-types';
-import { Component, cloneElement, useRef, useEffect, useCallback, useLayoutEffect, useReducer, useMemo } from 'react';
+import { cloneElement, Component, useRef, useEffect, useCallback, useLayoutEffect, useReducer, useMemo } from 'react';
 import { isForwardRef } from 'react-is';
 import compute from 'compute-scroll-into-view';
 import { __assign } from 'tslib';
 
-let idCounter = 0;
+var idCounter = 0;
 
 /**
  * Accepts a parameter and returns it if it's a function
@@ -28,17 +32,15 @@ function scrollIntoView(node, menuNode) {
   if (!node) {
     return;
   }
-  const actions = compute(node, {
+  var actions = compute(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;
   });
@@ -51,7 +53,7 @@ function scrollIntoView(node, menuNode) {
  * @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;
 }
 
@@ -64,7 +66,7 @@ function isOrContainsNode(parent, child, environment) {
  * @return {Function} the debounced function
  */
 function debounce(fn, time) {
-  let timeoutId;
+  var timeoutId;
   function cancel() {
     if (timeoutId) {
       clearTimeout(timeoutId);
@@ -75,9 +77,9 @@ function debounce(fn, time) {
       args[_key] = arguments[_key];
     }
     cancel();
-    timeoutId = setTimeout(() => {
+    timeoutId = setTimeout(function () {
       timeoutId = null;
-      fn(...args);
+      fn.apply(void 0, args);
     }, time);
   }
   wrapper.cancel = cancel;
@@ -99,9 +101,9 @@ function callAllEventHandlers() {
     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;
     });
@@ -111,8 +113,8 @@ function handleRefs() {
   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) {
@@ -146,11 +148,9 @@ function resetIdCounter() {
  * @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 '';
   }
@@ -158,7 +158,7 @@ function getA11yStatusMessage$1(_ref2) {
     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 '';
 }
@@ -205,9 +205,9 @@ function getElementProps(element) {
  */
 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
@@ -216,8 +216,8 @@ function pickState(state) {
   if (state === void 0) {
     state = {};
   }
-  const result = {};
-  stateKeys.forEach(k => {
+  var result = {};
+  stateKeys.forEach(function (k) {
     if (state.hasOwnProperty(k)) {
       result[k] = state[k];
     }
@@ -237,7 +237,7 @@ function pickState(state) {
  * @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;
   }, {});
@@ -262,13 +262,11 @@ function isControlledProp(props, key) {
  * @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;
 }
@@ -300,17 +298,17 @@ function getNextWrappingIndex(moveAmount, baseIndex, itemCount, getItemNodeFromI
   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;
   }
@@ -328,20 +326,20 @@ function getNextWrappingIndex(moveAmount, baseIndex, itemCount, getItemNodeFromI
  * @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;
       }
     }
   }
@@ -365,28 +363,30 @@ function targetWithinDownshift(target, downshiftElements, environment, checkActi
   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 */
 if (process.env.NODE_ENV !== 'production') {
-  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);
 
@@ -395,7 +395,7 @@ const cleanupStatus = debounce(documentProp => {
  * @param {Object} documentProp document passed by the user.
  */
 function setStatus(status, documentProp) {
-  const div = getStatusDiv(documentProp);
+  var div = getStatusDiv(documentProp);
   if (!status) {
     return;
   }
@@ -412,7 +412,7 @@ function getStatusDiv(documentProp) {
   if (documentProp === void 0) {
     documentProp = document;
   }
-  let statusDiv = documentProp.getElementById('a11y-status-message');
+  var statusDiv = documentProp.getElementById('a11y-status-message');
   if (statusDiv) {
     return statusDiv;
   }
@@ -435,23 +435,23 @@ function getStatusDiv(documentProp) {
   return statusDiv;
 }
 
-const unknown = process.env.NODE_ENV !== "production" ? '__autocomplete_unknown__' : 0;
-const mouseUp = process.env.NODE_ENV !== "production" ? '__autocomplete_mouseup__' : 1;
-const itemMouseEnter = process.env.NODE_ENV !== "production" ? '__autocomplete_item_mouseenter__' : 2;
-const keyDownArrowUp = process.env.NODE_ENV !== "production" ? '__autocomplete_keydown_arrow_up__' : 3;
-const keyDownArrowDown = process.env.NODE_ENV !== "production" ? '__autocomplete_keydown_arrow_down__' : 4;
-const keyDownEscape = process.env.NODE_ENV !== "production" ? '__autocomplete_keydown_escape__' : 5;
-const keyDownEnter = process.env.NODE_ENV !== "production" ? '__autocomplete_keydown_enter__' : 6;
-const keyDownHome = process.env.NODE_ENV !== "production" ? '__autocomplete_keydown_home__' : 7;
-const keyDownEnd = process.env.NODE_ENV !== "production" ? '__autocomplete_keydown_end__' : 8;
-const clickItem = process.env.NODE_ENV !== "production" ? '__autocomplete_click_item__' : 9;
-const blurInput = process.env.NODE_ENV !== "production" ? '__autocomplete_blur_input__' : 10;
-const changeInput = process.env.NODE_ENV !== "production" ? '__autocomplete_change_input__' : 11;
-const keyDownSpaceButton = process.env.NODE_ENV !== "production" ? '__autocomplete_keydown_space_button__' : 12;
-const clickButton = process.env.NODE_ENV !== "production" ? '__autocomplete_click_button__' : 13;
-const blurButton = process.env.NODE_ENV !== "production" ? '__autocomplete_blur_button__' : 14;
-const controlledPropUpdatedSelectedItem = process.env.NODE_ENV !== "production" ? '__autocomplete_controlled_prop_updated_selected_item__' : 15;
-const touchEnd = process.env.NODE_ENV !== "production" ? '__autocomplete_touchend__' : 16;
+var unknown = process.env.NODE_ENV !== "production" ? '__autocomplete_unknown__' : 0;
+var mouseUp = process.env.NODE_ENV !== "production" ? '__autocomplete_mouseup__' : 1;
+var itemMouseEnter = process.env.NODE_ENV !== "production" ? '__autocomplete_item_mouseenter__' : 2;
+var keyDownArrowUp = process.env.NODE_ENV !== "production" ? '__autocomplete_keydown_arrow_up__' : 3;
+var keyDownArrowDown = process.env.NODE_ENV !== "production" ? '__autocomplete_keydown_arrow_down__' : 4;
+var keyDownEscape = process.env.NODE_ENV !== "production" ? '__autocomplete_keydown_escape__' : 5;
+var keyDownEnter = process.env.NODE_ENV !== "production" ? '__autocomplete_keydown_enter__' : 6;
+var keyDownHome = process.env.NODE_ENV !== "production" ? '__autocomplete_keydown_home__' : 7;
+var keyDownEnd = process.env.NODE_ENV !== "production" ? '__autocomplete_keydown_end__' : 8;
+var clickItem = process.env.NODE_ENV !== "production" ? '__autocomplete_click_item__' : 9;
+var blurInput = process.env.NODE_ENV !== "production" ? '__autocomplete_blur_input__' : 10;
+var changeInput = process.env.NODE_ENV !== "production" ? '__autocomplete_change_input__' : 11;
+var keyDownSpaceButton = process.env.NODE_ENV !== "production" ? '__autocomplete_keydown_space_button__' : 12;
+var clickButton = process.env.NODE_ENV !== "production" ? '__autocomplete_click_button__' : 13;
+var blurButton = process.env.NODE_ENV !== "production" ? '__autocomplete_blur_button__' : 14;
+var controlledPropUpdatedSelectedItem = process.env.NODE_ENV !== "production" ? '__autocomplete_controlled_prop_updated_selected_item__' : 15;
+var touchEnd = process.env.NODE_ENV !== "production" ? '__autocomplete_touchend__' : 16;
 
 var stateChangeTypes$3 = /*#__PURE__*/Object.freeze({
   __proto__: null,
@@ -474,37 +474,48 @@ var stateChangeTypes$3 = /*#__PURE__*/Object.freeze({
   touchEnd: touchEnd
 });
 
-/* eslint camelcase:0 */
-const Downshift = /*#__PURE__*/(() => {
-  class Downshift extends 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;
         }
@@ -512,43 +523,41 @@ const Downshift = /*#__PURE__*/(() => {
           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
@@ -556,24 +565,21 @@ const Downshift = /*#__PURE__*/(() => {
         // 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
@@ -581,7 +587,7 @@ const Downshift = /*#__PURE__*/(() => {
             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]) {
@@ -598,7 +604,7 @@ const Downshift = /*#__PURE__*/(() => {
             }
             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];
             }
           });
@@ -606,66 +612,58 @@ const Downshift = /*#__PURE__*/(() => {
           // 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
             });
@@ -673,24 +671,26 @@ const Downshift = /*#__PURE__*/(() => {
             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
             });
@@ -698,32 +698,32 @@ const Downshift = /*#__PURE__*/(() => {
             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;
             }
@@ -732,176 +732,169 @@ const Downshift = /*#__PURE__*/(() => {
             });
           }
         },
-        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
         // if the NODE_ENV is test. With the proper build system, this should be dead code eliminated
         // when building for production and should therefore have no impact on production code.
         if (process.env.NODE_ENV === 'test') {
-          this.toggleMenu({
+          _this.toggleMenu({
             type: clickButton
           });
         } else {
           // 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.getInputProps = function (_temp4) {
-        let {
-          onKeyDown,
-          onBlur,
-          onChange,
-          onInput,
-          onChangeText,
-          ...rest
-        } = _temp4 === void 0 ? {} : _temp4;
-        let onChangeKey;
-        let eventHandlers = {};
+      _this.getLabelProps = function (props) {
+        return _extends({
+          htmlFor: _this.inputId,
+          id: _this.labelId
+        }, props);
+      };
+      _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,
@@ -910,82 +903,76 @@ const Downshift = /*#__PURE__*/(() => {
           // 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.getMenuProps = function (_temp5, _temp6) {
-        let {
-          refKey = 'ref',
-          ref,
-          ...props
-        } = _temp5 === void 0 ? {} : _temp5;
-        let {
-          suppressRefError = false
-        } = _temp6 === void 0 ? {} : _temp6;
+      _this.menuRef = function (node) {
+        _this._menuNode = node;
+      };
+      _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
-        };
-      };
-      this.getItemProps = function (_temp7) {
-        let {
-          onMouseMove,
-          onMouseDown,
-          onClick,
-          onPress,
-          index,
-          item = process.env.NODE_ENV === 'production' ? /* istanbul ignore next */undefined : requiredProp('getItemProps', 'item'),
-          ...rest
-        } = _temp7 === void 0 ? {} : _temp7;
+        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) {
+        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 ? process.env.NODE_ENV === 'production' ? /* istanbul ignore next */undefined : 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;
             }
@@ -998,75 +985,66 @@ const Downshift = /*#__PURE__*/(() => {
             // 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);
@@ -1075,57 +1053,58 @@ const Downshift = /*#__PURE__*/(() => {
           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 = [];
@@ -1139,117 +1118,113 @@ const Downshift = /*#__PURE__*/(() => {
      *
      * @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 (process.env.NODE_ENV !== 'production' && !false && this.getMenuProps.called && !this.getMenuProps.suppressRefError) {
         validateGetMenuPropsCalledCorrectly(this._menuNode, this.getMenuProps);
@@ -1262,18 +1237,20 @@ const Downshift = /*#__PURE__*/(() => {
         // 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
@@ -1282,31 +1259,31 @@ const Downshift = /*#__PURE__*/(() => {
         // 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);
@@ -1314,19 +1291,17 @@ const Downshift = /*#__PURE__*/(() => {
           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) {
       if (process.env.NODE_ENV !== 'production') {
         validateControlledUnchanged(this.state, prevProps, this.props);
         /* istanbul ignore if (react-native) */
@@ -1348,13 +1323,12 @@ const Downshift = /*#__PURE__*/(() => {
       {
         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.
@@ -1374,7 +1348,7 @@ const Downshift = /*#__PURE__*/(() => {
       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;
       }
@@ -1399,13 +1373,14 @@ const Downshift = /*#__PURE__*/(() => {
 
       /* istanbul ignore next */
       return undefined;
-    }
-  }
+    };
+    return Downshift;
+  }(Component);
   Downshift.defaultProps = {
     defaultHighlightedIndex: null,
     defaultIsOpen: false,
     getA11yStatusMessage: getA11yStatusMessage$1,
-    itemToString: i => {
+    itemToString: function itemToString(i) {
       if (i == null) {
         return '';
       }
@@ -1421,16 +1396,20 @@ const Downshift = /*#__PURE__*/(() => {
     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;
-})();
+}();
 process.env.NODE_ENV !== "production" ? Downshift.propTypes = {
   children: PropTypes.func,
   defaultHighlightedIndex: PropTypes.number,
@@ -1476,70 +1455,61 @@ process.env.NODE_ENV !== "production" ? Downshift.propTypes = {
   /* eslint-enable react/no-unused-prop-types */
 } : void 0;
 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 && !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 (!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));
   }
 }
 
@@ -1561,37 +1531,36 @@ function stateReducer(s, a) {
  * @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' ? useLayoutEffect : useEffect;
+var useIsomorphicLayoutEffect = typeof window !== 'undefined' && typeof window.document !== 'undefined' && typeof window.document.createElement !== 'undefined' ? useLayoutEffect : useEffect;
 function useElementIds(_ref) {
-  let {
-    id = `downshift-${generateId()}`,
-    labelId,
-    menuId,
-    getItemId,
-    toggleButtonId,
-    inputId
-  } = _ref;
-  const elementIdsRef = 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 = 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;
 }
@@ -1611,10 +1580,10 @@ function isAcceptedCharacterKey(key) {
   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 = useRef(val);
+  var ref = 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
@@ -1635,26 +1604,28 @@ function useLatestRef(val) {
  * @returns {Array} An array with the state and an action dispatcher.
  */
 function useEnhancedReducer(reducer, initialState, props) {
-  const prevStateRef = useRef();
-  const actionRef = useRef();
-  const enhancedReducer = useCallback((state, action) => {
+  var prevStateRef = useRef();
+  var actionRef = useRef();
+  var enhancedReducer = 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] = useReducer(enhancedReducer, initialState);
-  const propsRef = useLatestRef(props);
-  const dispatchWithProps = useCallback(action => dispatch({
-    props: propsRef.current,
-    ...action
-  }), [propsRef]);
-  const action = actionRef.current;
-  useEffect(() => {
+  var _useReducer = useReducer(enhancedReducer, initialState),
+    state = _useReducer[0],
+    dispatch = _useReducer[1];
+  var propsRef = useLatestRef(props);
+  var dispatchWithProps = useCallback(function (action) {
+    return dispatch(_extends({
+      props: propsRef.current
+    }, action));
+  }, [propsRef]);
+  var action = actionRef.current;
+  useEffect(function () {
     if (action && prevStateRef.current && prevStateRef.current !== state) {
       callOnChangeProps(action, getState(prevStateRef.current, action.props), state);
     }
@@ -1673,14 +1644,16 @@ function useEnhancedReducer(reducer, initialState, props) {
  * @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
 };
@@ -1688,7 +1661,7 @@ function getDefaultValue$1(props, propKey, defaultStateValues) {
   if (defaultStateValues === void 0) {
     defaultStateValues = dropdownDefaultStateValues;
   }
-  const defaultValue = props[`default${capitalizeString(propKey)}`];
+  var defaultValue = props["default" + capitalizeString(propKey)];
   if (defaultValue !== undefined) {
     return defaultValue;
   }
@@ -1698,38 +1671,34 @@ function getInitialValue$1(props, propKey, defaultStateValues) {
   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;
   }
@@ -1760,30 +1729,34 @@ function getHighlightedIndexOnOpen(props, state, offset) {
  * @returns {Object} Ref containing whether mouseDown or touchMove event is happening
  */
 function useMouseAndTouchTracker(isOpen, downshiftElementRefs, environment, handleBlur) {
-  const mouseAndTouchTrackersRef = useRef({
+  var mouseAndTouchTrackersRef = useRef({
     isMouseDown: false,
     isTouchMove: false
   });
-  useEffect(() => {
+  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();
       }
     };
@@ -1806,7 +1779,9 @@ function useMouseAndTouchTracker(isOpen, downshiftElementRefs, environment, hand
 
 /* 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.
  *
@@ -1815,82 +1790,77 @@ let useGetterPropsCalledChecker = () => noop;
  */
 /* istanbul ignore next */
 if (process.env.NODE_ENV !== 'production') {
-  useGetterPropsCalledChecker = function () {
-    const isInitialMountRef = useRef(true);
+  useGetterPropsCalledChecker = function useGetterPropsCalledChecker() {
+    var isInitialMountRef = useRef(true);
     for (var _len = arguments.length, propKeys = new Array(_len), _key = 0; _key < _len; _key++) {
       propKeys[_key] = arguments[_key];
     }
-    const getterPropsCalledRef = useRef(propKeys.reduce((acc, propKey) => {
+    var getterPropsCalledRef = useRef(propKeys.reduce(function (acc, propKey) {
       acc[propKey] = {};
       return acc;
     }, {}));
-    useEffect(() => {
-      Object.keys(getterPropsCalledRef.current).forEach(propKey => {
-        const propCallInfo = getterPropsCalledRef.current[propKey];
+    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 = useCallback((propKey, suppressRefError, refKey, elementRef) => {
+    var setGetterPropCallInfo = 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.
-  useEffect(() => {
+  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 = useRef(true);
+  var shouldScrollRef = useRef(true);
   // Scroll on highlighted item if change comes from keyboard.
-  useIsomorphicLayoutEffect(() => {
+  useIsomorphicLayoutEffect(function () {
     if (highlightedIndex < 0 || !isOpen || !Object.keys(itemRefs.current).length) {
       return;
     }
@@ -1905,18 +1875,16 @@ function useScrollIntoView(_ref3) {
 }
 
 // eslint-disable-next-line import/no-mutable-exports
-let useControlPropsValidator = noop;
+var useControlPropsValidator = noop;
 /* istanbul ignore next */
 if (process.env.NODE_ENV !== 'production') {
-  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 = useRef(props);
-    useEffect(() => {
+    var prevPropsRef = useRef(props);
+    useEffect(function () {
       if (isInitialMount) {
         return;
       }
@@ -1927,11 +1895,9 @@ if (process.env.NODE_ENV !== 'production') {
 }
 
 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 = {
@@ -1982,10 +1948,7 @@ function downshiftCommonReducer(state, action, stateChangeTypes) {
     default:
       throw new Error('Reducer called without proper action type.');
   }
-  return {
-    ...state,
-    ...changes
-  };
+  return _extends({}, state, changes);
 }
 /* eslint-enable complexity */
 
@@ -2071,28 +2034,28 @@ if (process.env.NODE_ENV !== 'production') {
     };
 }
 
-const ToggleButtonClick$1 = process.env.NODE_ENV !== "production" ? '__togglebutton_click__' : 0;
-const ToggleButtonKeyDownArrowDown = process.env.NODE_ENV !== "production" ? '__togglebutton_keydown_arrow_down__' : 1;
-const ToggleButtonKeyDownArrowUp = process.env.NODE_ENV !== "production" ? '__togglebutton_keydown_arrow_up__' : 2;
-const ToggleButtonKeyDownCharacter = process.env.NODE_ENV !== "production" ? '__togglebutton_keydown_character__' : 3;
-const ToggleButtonKeyDownEscape = process.env.NODE_ENV !== "production" ? '__togglebutton_keydown_escape__' : 4;
-const ToggleButtonKeyDownHome = process.env.NODE_ENV !== "production" ? '__togglebutton_keydown_home__' : 5;
-const ToggleButtonKeyDownEnd = process.env.NODE_ENV !== "production" ? '__togglebutton_keydown_end__' : 6;
-const ToggleButtonKeyDownEnter = process.env.NODE_ENV !== "production" ? '__togglebutton_keydown_enter__' : 7;
-const ToggleButtonKeyDownSpaceButton = process.env.NODE_ENV !== "production" ? '__togglebutton_keydown_space_button__' : 8;
-const ToggleButtonKeyDownPageUp = process.env.NODE_ENV !== "production" ? '__togglebutton_keydown_page_up__' : 9;
-const ToggleButtonKeyDownPageDown = process.env.NODE_ENV !== "production" ? '__togglebutton_keydown_page_down__' : 10;
-const ToggleButtonBlur = process.env.NODE_ENV !== "production" ? '__togglebutton_blur__' : 11;
-const MenuMouseLeave$1 = process.env.NODE_ENV !== "production" ? '__menu_mouse_leave__' : 12;
-const ItemMouseMove$1 = process.env.NODE_ENV !== "production" ? '__item_mouse_move__' : 13;
-const ItemClick$1 = process.env.NODE_ENV !== "production" ? '__item_click__' : 14;
-const FunctionToggleMenu$1 = process.env.NODE_ENV !== "production" ? '__function_toggle_menu__' : 15;
-const FunctionOpenMenu$1 = process.env.NODE_ENV !== "production" ? '__function_open_menu__' : 16;
-const FunctionCloseMenu$1 = process.env.NODE_ENV !== "production" ? '__function_close_menu__' : 17;
-const FunctionSetHighlightedIndex$1 = process.env.NODE_ENV !== "production" ? '__function_set_highlighted_index__' : 18;
-const FunctionSelectItem$1 = process.env.NODE_ENV !== "production" ? '__function_select_item__' : 19;
-const FunctionSetInputValue$1 = process.env.NODE_ENV !== "production" ? '__function_set_input_value__' : 20;
-const FunctionReset$2 = process.env.NODE_ENV !== "production" ? '__function_reset__' : 21;
+var ToggleButtonClick$1 = process.env.NODE_ENV !== "production" ? '__togglebutton_click__' : 0;
+var ToggleButtonKeyDownArrowDown = process.env.NODE_ENV !== "production" ? '__togglebutton_keydown_arrow_down__' : 1;
+var ToggleButtonKeyDownArrowUp = process.env.NODE_ENV !== "production" ? '__togglebutton_keydown_arrow_up__' : 2;
+var ToggleButtonKeyDownCharacter = process.env.NODE_ENV !== "production" ? '__togglebutton_keydown_character__' : 3;
+var ToggleButtonKeyDownEscape = process.env.NODE_ENV !== "production" ? '__togglebutton_keydown_escape__' : 4;
+var ToggleButtonKeyDownHome = process.env.NODE_ENV !== "production" ? '__togglebutton_keydown_home__' : 5;
+var ToggleButtonKeyDownEnd = process.env.NODE_ENV !== "production" ? '__togglebutton_keydown_end__' : 6;
+var ToggleButtonKeyDownEnter = process.env.NODE_ENV !== "production" ? '__togglebutton_keydown_enter__' : 7;
+var ToggleButtonKeyDownSpaceButton = process.env.NODE_ENV !== "production" ? '__togglebutton_keydown_space_button__' : 8;
+var ToggleButtonKeyDownPageUp = process.env.NODE_ENV !== "production" ? '__togglebutton_keydown_page_up__' : 9;
+var ToggleButtonKeyDownPageDown = process.env.NODE_ENV !== "production" ? '__togglebutton_keydown_page_down__' : 10;
+var ToggleButtonBlur = process.env.NODE_ENV !== "production" ? '__togglebutton_blur__' : 11;
+var MenuMouseLeave$1 = process.env.NODE_ENV !== "production" ? '__menu_mouse_leave__' : 12;
+var ItemMouseMove$1 = process.env.NODE_ENV !== "production" ? '__item_mouse_move__' : 13;
+var ItemClick$1 = process.env.NODE_ENV !== "production" ? '__item_click__' : 14;
+var FunctionToggleMenu$1 = process.env.NODE_ENV !== "production" ? '__function_toggle_menu__' : 15;
+var FunctionOpenMenu$1 = process.env.NODE_ENV !== "production" ? '__function_open_menu__' : 16;
+var FunctionCloseMenu$1 = process.env.NODE_ENV !== "production" ? '__function_close_menu__' : 17;
+var FunctionSetHighlightedIndex$1 = process.env.NODE_ENV !== "production" ? '__function_set_highlighted_index__' : 18;
+var FunctionSelectItem$1 = process.env.NODE_ENV !== "production" ? '__function_select_item__' : 19;
+var FunctionSetInputValue$1 = process.env.NODE_ENV !== "production" ? '__function_set_input_value__' : 20;
+var FunctionReset$2 = process.env.NODE_ENV !== "production" ? '__function_reset__' : 21;
 
 var stateChangeTypes$2 = /*#__PURE__*/Object.freeze({
   __proto__: null,
@@ -2122,12 +2085,10 @@ var stateChangeTypes$2 = /*#__PURE__*/Object.freeze({
 
 /* 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 = {
@@ -2138,10 +2099,10 @@ function downshiftSelectReducer(state, action) {
       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,
@@ -2149,34 +2110,33 @@ function downshiftSelectReducer(state, action) {
           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
         };
       }
@@ -2184,13 +2144,12 @@ function downshiftSelectReducer(state, action) {
     // 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 = {
@@ -2221,13 +2180,12 @@ function downshiftSelectReducer(state, action) {
       };
       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 = {
@@ -2237,13 +2195,13 @@ function downshiftSelectReducer(state, action) {
     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) {
@@ -2251,81 +2209,76 @@ function useSelect(userProps) {
   }
   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 = useRef(null);
-  const menuRef = useRef(null);
-  const itemRefs = useRef({});
+  var toggleButtonRef = useRef(null);
+  var menuRef = useRef(null);
+  var itemRefs = useRef({});
   // used to keep the inputValue clearTimeout object between renders.
-  const clearTimeoutRef = useRef(null);
+  var clearTimeoutRef = 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 = useRef();
-  const isInitialMountRef = useRef(true);
+  var previousResultCountRef = useRef();
+  var isInitialMountRef = useRef(true);
   // utility callback to get item element.
-  const latest = useLatestRef({
-    state,
-    props
+  var latest = useLatestRef({
+    state: state,
+    props: props
   });
 
   // Some utils.
-  const getItemNodeFromIndex = useCallback(index => itemRefs.current[elementIds.getItemId(index)], [elementIds]);
+  var getItemNodeFromIndex = 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.
-  useEffect(() => {
+  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: ''
@@ -2333,13 +2286,13 @@ function useSelect(userProps) {
     }, 500);
 
     // Cancel any pending debounced calls on mount
-    return () => {
+    return function () {
       clearTimeoutRef.current.cancel();
     };
   }, []);
 
   // Invokes the keysSoFar callback set up above.
-  useEffect(() => {
+  useEffect(function () {
     if (!inputValue) {
       return;
     }
@@ -2347,249 +2300,234 @@ function useSelect(userProps) {
   }, [dispatch, inputValue]);
   useControlPropsValidator({
     isInitialMount: isInitialMountRef.current,
-    props,
-    state
+    props: props,
+    state: state
   });
-  useEffect(() => {
+  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.
-  useEffect(() => {
+  useEffect(function () {
     isInitialMountRef.current = false;
-    return () => {
+    return function () {
       isInitialMountRef.current = true;
     };
   }, []);
   // Reset itemRefs on close.
-  useEffect(() => {
+  useEffect(function () {
     if (!isOpen) {
       itemRefs.current = {};
     }
   }, [isOpen]);
 
   // Event handler functions.
-  const toggleButtonKeyDownHandlers = 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 = 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 = useCallback(() => {
+  var toggleMenu = useCallback(function () {
     dispatch({
       type: FunctionToggleMenu$1
     });
   }, [dispatch]);
-  const closeMenu = useCallback(() => {
+  var closeMenu = useCallback(function () {
     dispatch({
       type: FunctionCloseMenu$1
     });
   }, [dispatch]);
-  const openMenu = useCallback(() => {
+  var openMenu = useCallback(function () {
     dispatch({
       type: FunctionOpenMenu$1
     });
   }, [dispatch]);
-  const setHighlightedIndex = useCallback(newHighlightedIndex => {
+  var setHighlightedIndex = useCallback(function (newHighlightedIndex) {
     dispatch({
       type: FunctionSetHighlightedIndex$1,
       highlightedIndex: newHighlightedIndex
     });
   }, [dispatch]);
-  const selectItem = useCallback(newSelectedItem => {
+  var selectItem = useCallback(function (newSelectedItem) {
     dispatch({
       type: FunctionSelectItem$1,
       selectedItem: newSelectedItem
     });
   }, [dispatch]);
-  const reset = useCallback(() => {
+  var reset = useCallback(function () {
     dispatch({
       type: FunctionReset$2
     });
   }, [dispatch]);
-  const setInputValue = useCallback(newInputValue => {
+  var setInputValue = useCallback(function (newInputValue) {
     dispatch({
       type: FunctionSetInputValue$1,
       inputValue: newInputValue
     });
   }, [dispatch]);
   // Getter functions.
-  const getLabelProps = useCallback(labelProps => ({
-    id: elementIds.labelId,
-    htmlFor: elementIds.toggleButtonId,
-    ...labelProps
-  }), [elementIds]);
-  const getMenuProps = 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 = useCallback(function (labelProps) {
+    return _extends({
+      id: elementIds.labelId,
+      htmlFor: elementIds.toggleButtonId
+    }, labelProps);
+  }, [elementIds]);
+  var getMenuProps = 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 = 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 = 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);
@@ -2597,56 +2535,54 @@ function useSelect(userProps) {
     setGetterPropCallInfo('getToggleButtonProps', suppressRefError, refKey, toggleButtonRef);
     return toggleProps;
   }, [latest, elementIds, setGetterPropCallInfo, dispatch, mouseAndTouchTrackersRef, toggleButtonKeyDownHandlers, getItemNodeFromIndex]);
-  const getItemProps = 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 = 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);
     }
@@ -2655,49 +2591,49 @@ function useSelect(userProps) {
   }, [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 = process.env.NODE_ENV !== "production" ? '__input_keydown_arrow_down__' : 0;
-const InputKeyDownArrowUp = process.env.NODE_ENV !== "production" ? '__input_keydown_arrow_up__' : 1;
-const InputKeyDownEscape = process.env.NODE_ENV !== "production" ? '__input_keydown_escape__' : 2;
-const InputKeyDownHome = process.env.NODE_ENV !== "production" ? '__input_keydown_home__' : 3;
-const InputKeyDownEnd = process.env.NODE_ENV !== "production" ? '__input_keydown_end__' : 4;
-const InputKeyDownPageUp = process.env.NODE_ENV !== "production" ? '__input_keydown_page_up__' : 5;
-const InputKeyDownPageDown = process.env.NODE_ENV !== "production" ? '__input_keydown_page_down__' : 6;
-const InputKeyDownEnter = process.env.NODE_ENV !== "production" ? '__input_keydown_enter__' : 7;
-const InputChange = process.env.NODE_ENV !== "production" ? '__input_change__' : 8;
-const InputBlur = process.env.NODE_ENV !== "production" ? '__input_blur__' : 9;
-const InputFocus = process.env.NODE_ENV !== "production" ? '__input_focus__' : 10;
-const MenuMouseLeave = process.env.NODE_ENV !== "production" ? '__menu_mouse_leave__' : 11;
-const ItemMouseMove = process.env.NODE_ENV !== "production" ? '__item_mouse_move__' : 12;
-const ItemClick = process.env.NODE_ENV !== "production" ? '__item_click__' : 13;
-const ToggleButtonClick = process.env.NODE_ENV !== "production" ? '__togglebutton_click__' : 14;
-const FunctionToggleMenu = process.env.NODE_ENV !== "production" ? '__function_toggle_menu__' : 15;
-const FunctionOpenMenu = process.env.NODE_ENV !== "production" ? '__function_open_menu__' : 16;
-const FunctionCloseMenu = process.env.NODE_ENV !== "production" ? '__function_close_menu__' : 17;
-const FunctionSetHighlightedIndex = process.env.NODE_ENV !== "production" ? '__function_set_highlighted_index__' : 18;
-const FunctionSelectItem = process.env.NODE_ENV !== "production" ? '__function_select_item__' : 19;
-const FunctionSetInputValue = process.env.NODE_ENV !== "production" ? '__function_set_input_value__' : 20;
-const FunctionReset$1 = process.env.NODE_ENV !== "production" ? '__function_reset__' : 21;
-const ControlledPropUpdatedSelectedItem = process.env.NODE_ENV !== "production" ? '__controlled_prop_updated_selected_item__' : 22;
+var InputKeyDownArrowDown = process.env.NODE_ENV !== "production" ? '__input_keydown_arrow_down__' : 0;
+var InputKeyDownArrowUp = process.env.NODE_ENV !== "production" ? '__input_keydown_arrow_up__' : 1;
+var InputKeyDownEscape = process.env.NODE_ENV !== "production" ? '__input_keydown_escape__' : 2;
+var InputKeyDownHome = process.env.NODE_ENV !== "production" ? '__input_keydown_home__' : 3;
+var InputKeyDownEnd = process.env.NODE_ENV !== "production" ? '__input_keydown_end__' : 4;
+var InputKeyDownPageUp = process.env.NODE_ENV !== "production" ? '__input_keydown_page_up__' : 5;
+var InputKeyDownPageDown = process.env.NODE_ENV !== "production" ? '__input_keydown_page_down__' : 6;
+var InputKeyDownEnter = process.env.NODE_ENV !== "production" ? '__input_keydown_enter__' : 7;
+var InputChange = process.env.NODE_ENV !== "production" ? '__input_change__' : 8;
+var InputBlur = process.env.NODE_ENV !== "production" ? '__input_blur__' : 9;
+var InputFocus = process.env.NODE_ENV !== "production" ? '__input_focus__' : 10;
+var MenuMouseLeave = process.env.NODE_ENV !== "production" ? '__menu_mouse_leave__' : 11;
+var ItemMouseMove = process.env.NODE_ENV !== "production" ? '__item_mouse_move__' : 12;
+var ItemClick = process.env.NODE_ENV !== "production" ? '__item_click__' : 13;
+var ToggleButtonClick = process.env.NODE_ENV !== "production" ? '__togglebutton_click__' : 14;
+var FunctionToggleMenu = process.env.NODE_ENV !== "production" ? '__function_toggle_menu__' : 15;
+var FunctionOpenMenu = process.env.NODE_ENV !== "production" ? '__function_open_menu__' : 16;
+var FunctionCloseMenu = process.env.NODE_ENV !== "production" ? '__function_close_menu__' : 17;
+var FunctionSetHighlightedIndex = process.env.NODE_ENV !== "production" ? '__function_set_highlighted_index__' : 18;
+var FunctionSelectItem = process.env.NODE_ENV !== "production" ? '__function_select_item__' : 19;
+var FunctionSetInputValue = process.env.NODE_ENV !== "production" ? '__function_set_input_value__' : 20;
+var FunctionReset$1 = process.env.NODE_ENV !== "production" ? '__function_reset__' : 21;
+var ControlledPropUpdatedSelectedItem = process.env.NODE_ENV !== "production" ? '__controlled_prop_updated_selected_item__' : 22;
 
 var stateChangeTypes$1 = /*#__PURE__*/Object.freeze({
   __proto__: null,
@@ -2727,22 +2663,17 @@ var stateChangeTypes$1 = /*#__PURE__*/Object.freeze({
 });
 
 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,
@@ -2795,11 +2726,13 @@ const propTypes$1 = {
  * @returns {Array} An array with the state and an action dispatcher.
  */
 function useControlledReducer(reducer, initialState, props) {
-  const previousSelectedItemRef = useRef();
-  const [state, dispatch] = useEnhancedReducer(reducer, initialState, props);
+  var previousSelectedItemRef = useRef();
+  var _useEnhancedReducer = useEnhancedReducer(reducer, initialState, props),
+    state = _useEnhancedReducer[0],
+    dispatch = _useEnhancedReducer[1];
 
   // ToDo: if needed, make same approach as selectedItemChanged from Downshift.
-  useEffect(() => {
+  useEffect(function () {
     if (isControlledProp(props, 'selectedItem')) {
       if (previousSelectedItemRef.current !== props.selectedItem) {
         dispatch({
@@ -2814,26 +2747,23 @@ function useControlledReducer(reducer, initialState, props) {
 }
 
 // eslint-disable-next-line import/no-mutable-exports
-let validatePropTypes$1 = noop;
+var validatePropTypes$1 = noop;
 /* istanbul ignore next */
 if (process.env.NODE_ENV !== 'production') {
-  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 = {
@@ -2858,14 +2788,13 @@ function downshiftUseComboboxReducer(state, action) {
     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)
@@ -2879,24 +2808,22 @@ function downshiftUseComboboxReducer(state, action) {
       }
       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 = {
@@ -2919,14 +2846,13 @@ function downshiftUseComboboxReducer(state, action) {
       };
       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 = {
@@ -2955,14 +2881,14 @@ function downshiftUseComboboxReducer(state, action) {
     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) {
@@ -2970,349 +2896,327 @@ function useCombobox(userProps) {
   }
   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 = useRef(null);
-  const itemRefs = useRef({});
-  const inputRef = useRef(null);
-  const toggleButtonRef = useRef(null);
-  const isInitialMountRef = useRef(true);
+  var menuRef = useRef(null);
+  var itemRefs = useRef({});
+  var inputRef = useRef(null);
+  var toggleButtonRef = useRef(null);
+  var isInitialMountRef = 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 = useRef();
+  var previousResultCountRef = useRef();
   // utility callback to get item element.
-  const latest = useLatestRef({
-    state,
-    props
+  var latest = useLatestRef({
+    state: state,
+    props: props
   });
-  const getItemNodeFromIndex = useCallback(index => itemRefs.current[elementIds.getItemId(index)], [elementIds]);
+  var getItemNodeFromIndex = 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.
-  useEffect(() => {
-    const focusOnOpen = initialIsOpen || defaultIsOpen || isOpen;
+  useEffect(function () {
+    var focusOnOpen = initialIsOpen || defaultIsOpen || isOpen;
     if (focusOnOpen && inputRef.current) {
       inputRef.current.focus();
     }
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
-  useEffect(() => {
+  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.
-  useEffect(() => {
+  useEffect(function () {
     isInitialMountRef.current = false;
-    return () => {
+    return function () {
       isInitialMountRef.current = true;
     };
   }, []);
   // Reset itemRefs on close.
-  useEffect(() => {
+  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 = 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 = 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 = useCallback(labelProps => ({
-    id: elementIds.labelId,
-    htmlFor: elementIds.inputId,
-    ...labelProps
-  }), [elementIds]);
-  const getMenuProps = useCallback(function (_temp, _temp2) {
-    let {
-      onMouseLeave,
-      refKey = 'ref',
-      ref,
-      ...rest
-    } = _temp === void 0 ? {} : _temp;
-    let {
-      suppressRefError = false
-    } = _temp2 === void 0 ? {} : _temp2;
+  var getLabelProps = useCallback(function (labelProps) {
+    return _extends({
+      id: elementIds.labelId,
+      htmlFor: elementIds.inputId
+    }, labelProps);
+  }, [elementIds]);
+  var getMenuProps = 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 = 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 = 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 = useCallback(function (_temp4) {
-    let {
-      onClick,
-      onPress,
-      refKey = 'ref',
-      ref,
-      ...rest
-    } = _temp4 === void 0 ? {} : _temp4;
-    const latestState = latest.current.state;
-    const toggleButtonHandleClick = () => {
+  var getToggleButtonProps = 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 = 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 = 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({
@@ -3321,7 +3225,7 @@ function useCombobox(userProps) {
         });
       }
     };
-    const inputHandleFocus = () => {
+    var inputHandleFocus = function inputHandleFocus() {
       if (!latestState.isOpen) {
         dispatch({
           type: InputFocus
@@ -3330,99 +3234,80 @@ function useCombobox(userProps) {
     };
 
     /* 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 = useCallback(() => {
+  var toggleMenu = useCallback(function () {
     dispatch({
       type: FunctionToggleMenu
     });
   }, [dispatch]);
-  const closeMenu = useCallback(() => {
+  var closeMenu = useCallback(function () {
     dispatch({
       type: FunctionCloseMenu
     });
   }, [dispatch]);
-  const openMenu = useCallback(() => {
+  var openMenu = useCallback(function () {
     dispatch({
       type: FunctionOpenMenu
     });
   }, [dispatch]);
-  const setHighlightedIndex = useCallback(newHighlightedIndex => {
+  var setHighlightedIndex = useCallback(function (newHighlightedIndex) {
     dispatch({
       type: FunctionSetHighlightedIndex,
       highlightedIndex: newHighlightedIndex
     });
   }, [dispatch]);
-  const selectItem = useCallback(newSelectedItem => {
+  var selectItem = useCallback(function (newSelectedItem) {
     dispatch({
       type: FunctionSelectItem,
       selectedItem: newSelectedItem
     });
   }, [dispatch]);
-  const setInputValue = useCallback(newInputValue => {
+  var setInputValue = useCallback(function (newInputValue) {
     dispatch({
       type: FunctionSetInputValue,
       inputValue: newInputValue
     });
   }, [dispatch]);
-  const reset = useCallback(() => {
+  var reset = 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: []
 };
@@ -3460,11 +3345,11 @@ function getDefaultValue(props, propKey) {
  * @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
   };
 }
 
@@ -3481,7 +3366,7 @@ function isKeyDownOperationPermitted(event) {
   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 !== '' && (
@@ -3500,13 +3385,11 @@ function isKeyDownOperationPermitted(event) {
  * @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,
@@ -3530,37 +3413,37 @@ const propTypes = {
     })
   })
 };
-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 */
 if (process.env.NODE_ENV !== 'production') {
-  validatePropTypes = (options, caller) => {
+  validatePropTypes = function validatePropTypes(options, caller) {
     PropTypes.checkPropTypes(propTypes, options, 'prop', caller.name);
   };
 }
 
-const SelectedItemClick = process.env.NODE_ENV !== "production" ? '__selected_item_click__' : 0;
-const SelectedItemKeyDownDelete = process.env.NODE_ENV !== "production" ? '__selected_item_keydown_delete__' : 1;
-const SelectedItemKeyDownBackspace = process.env.NODE_ENV !== "production" ? '__selected_item_keydown_backspace__' : 2;
-const SelectedItemKeyDownNavigationNext = process.env.NODE_ENV !== "production" ? '__selected_item_keydown_navigation_next__' : 3;
-const SelectedItemKeyDownNavigationPrevious = process.env.NODE_ENV !== "production" ? '__selected_item_keydown_navigation_previous__' : 4;
-const DropdownKeyDownNavigationPrevious = process.env.NODE_ENV !== "production" ? '__dropdown_keydown_navigation_previous__' : 5;
-const DropdownKeyDownBackspace = process.env.NODE_ENV !== "production" ? '__dropdown_keydown_backspace__' : 6;
-const DropdownClick = process.env.NODE_ENV !== "production" ? '__dropdown_click__' : 7;
-const FunctionAddSelectedItem = process.env.NODE_ENV !== "production" ? '__function_add_selected_item__' : 8;
-const FunctionRemoveSelectedItem = process.env.NODE_ENV !== "production" ? '__function_remove_selected_item__' : 9;
-const FunctionSetSelectedItems = process.env.NODE_ENV !== "production" ? '__function_set_selected_items__' : 10;
-const FunctionSetActiveIndex = process.env.NODE_ENV !== "production" ? '__function_set_active_index__' : 11;
-const FunctionReset = process.env.NODE_ENV !== "production" ? '__function_reset__' : 12;
+var SelectedItemClick = process.env.NODE_ENV !== "production" ? '__selected_item_click__' : 0;
+var SelectedItemKeyDownDelete = process.env.NODE_ENV !== "production" ? '__selected_item_keydown_delete__' : 1;
+var SelectedItemKeyDownBackspace = process.env.NODE_ENV !== "production" ? '__selected_item_keydown_backspace__' : 2;
+var SelectedItemKeyDownNavigationNext = process.env.NODE_ENV !== "production" ? '__selected_item_keydown_navigation_next__' : 3;
+var SelectedItemKeyDownNavigationPrevious = process.env.NODE_ENV !== "production" ? '__selected_item_keydown_navigation_previous__' : 4;
+var DropdownKeyDownNavigationPrevious = process.env.NODE_ENV !== "production" ? '__dropdown_keydown_navigation_previous__' : 5;
+var DropdownKeyDownBackspace = process.env.NODE_ENV !== "production" ? '__dropdown_keydown_backspace__' : 6;
+var DropdownClick = process.env.NODE_ENV !== "production" ? '__dropdown_click__' : 7;
+var FunctionAddSelectedItem = process.env.NODE_ENV !== "production" ? '__function_add_selected_item__' : 8;
+var FunctionRemoveSelectedItem = process.env.NODE_ENV !== "production" ? '__function_remove_selected_item__' : 9;
+var FunctionSetSelectedItems = process.env.NODE_ENV !== "production" ? '__function_set_selected_items__' : 10;
+var FunctionSetActiveIndex = process.env.NODE_ENV !== "production" ? '__function_set_active_index__' : 11;
+var FunctionReset = process.env.NODE_ENV !== "production" ? '__function_reset__' : 12;
 
 var stateChangeTypes = /*#__PURE__*/Object.freeze({
   __proto__: null,
@@ -3581,17 +3464,13 @@ var stateChangeTypes = /*#__PURE__*/Object.freeze({
 
 /* 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 = {
@@ -3614,18 +3493,17 @@ function downshiftMultipleSelectionReducer(state, action) {
         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:
@@ -3640,7 +3518,7 @@ function downshiftMultipleSelectionReducer(state, action) {
       break;
     case FunctionAddSelectedItem:
       changes = {
-        selectedItems: [...selectedItems, selectedItem]
+        selectedItems: [].concat(selectedItems, [selectedItem])
       };
       break;
     case DropdownClick:
@@ -3650,27 +3528,25 @@ function downshiftMultipleSelectionReducer(state, action) {
       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
         };
@@ -3678,11 +3554,9 @@ function downshiftMultipleSelectionReducer(state, action) {
       }
     case FunctionSetActiveIndex:
       {
-        const {
-          activeIndex: newActiveIndex
-        } = action;
+        var _newActiveIndex2 = action.activeIndex;
         changes = {
-          activeIndex: newActiveIndex
+          activeIndex: _newActiveIndex2
         };
         break;
       }
@@ -3695,12 +3569,11 @@ function downshiftMultipleSelectionReducer(state, action) {
     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) {
@@ -3708,49 +3581,46 @@ function useMultipleSelection(userProps) {
   }
   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 = useRef(true);
-  const dropdownRef = useRef(null);
-  const previousSelectedItemsRef = useRef(selectedItems);
-  const selectedItemRefs = useRef();
+  var isInitialMountRef = useRef(true);
+  var dropdownRef = useRef(null);
+  var previousSelectedItemsRef = useRef(selectedItems);
+  var selectedItemRefs = useRef();
   selectedItemRefs.current = [];
-  const latest = useLatestRef({
-    state,
-    props
+  var latest = useLatestRef({
+    state: state,
+    props: props
   });
 
   // Effects.
   /* Sets a11y status message on changes in selectedItem. */
-  useEffect(() => {
+  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);
     }
@@ -3759,7 +3629,7 @@ function useMultipleSelection(userProps) {
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [selectedItems.length]);
   // Sets focus on active item.
-  useEffect(() => {
+  useEffect(function () {
     if (isInitialMountRef.current) {
       return;
     }
@@ -3771,178 +3641,167 @@ function useMultipleSelection(userProps) {
   }, [activeIndex]);
   useControlPropsValidator({
     isInitialMount: isInitialMountRef.current,
-    props,
-    state
+    props: props,
+    state: state
   });
-  const setGetterPropCallInfo = useGetterPropsCalledChecker('getDropdownProps');
+  var setGetterPropCallInfo = useGetterPropsCalledChecker('getDropdownProps');
   // Make initial ref false.
-  useEffect(() => {
+  useEffect(function () {
     isInitialMountRef.current = false;
-    return () => {
+    return function () {
       isInitialMountRef.current = true;
     };
   }, []);
 
   // Event handler functions.
-  const selectedItemKeyDownHandlers = useMemo(() => ({
-    [keyNavigationPrevious]() {
+  var selectedItemKeyDownHandlers = 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 = useMemo(() => ({
-    [keyNavigationPrevious](event) {
+    }, _ref;
+  }, [dispatch, keyNavigationNext, keyNavigationPrevious]);
+  var dropdownKeyDownHandlers = 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 = 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 = 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 = 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 = 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 = useCallback(selectedItem => {
+  var addSelectedItem = useCallback(function (selectedItem) {
     dispatch({
       type: FunctionAddSelectedItem,
-      selectedItem
+      selectedItem: selectedItem
     });
   }, [dispatch]);
-  const removeSelectedItem = useCallback(selectedItem => {
+  var removeSelectedItem = useCallback(function (selectedItem) {
     dispatch({
       type: FunctionRemoveSelectedItem,
-      selectedItem
+      selectedItem: selectedItem
     });
   }, [dispatch]);
-  const setSelectedItems = useCallback(newSelectedItems => {
+  var setSelectedItems = useCallback(function (newSelectedItems) {
     dispatch({
       type: FunctionSetSelectedItems,
       selectedItems: newSelectedItems
     });
   }, [dispatch]);
-  const setActiveIndex = useCallback(newActiveIndex => {
+  var setActiveIndex = useCallback(function (newActiveIndex) {
     dispatch({
       type: FunctionSetActiveIndex,
       activeIndex: newActiveIndex
     });
   }, [dispatch]);
-  const reset = useCallback(() => {
+  var reset = 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
   };
 }