downshift 3.1.1 → 3.1.5

package/README.md

@@ -19,7 +19,7 @@ autocomplete/dropdown/select/combobox components</p>
 [![downloads][downloads-badge]][npmcharts] [![version][version-badge]][package]
 [![MIT License][license-badge]][license]
 
-[![All Contributors](https://img.shields.io/badge/all_contributors-100-orange.svg?style=flat-square)](#contributors)
+[![All Contributors](https://img.shields.io/badge/all_contributors-102-orange.svg?style=flat-square)](#contributors)
 [![PRs Welcome][prs-badge]][prs] [![Chat][chat-badge]][chat]
 [![Code of Conduct][coc-badge]][coc]
 [![Join the community on Spectrum][spectrum-badge]][spectrum]
@@ -603,7 +603,9 @@ function). However, if you're rendering a composite component (custom component)
 as the root element, then you'll need to call `getRootProps` and apply that to
 your root element (downshift will throw an error otherwise).
 
-Required properties:
+There are no required properties for this method.
+
+Optional properties:
 
 - `refKey`: if you're rendering a composite component, that component will need
   to accept a prop which it forwards to the root DOM element. Commonly, folks
@@ -1076,7 +1078,7 @@ Thanks goes to these people ([emoji key][emojis]):
 | [<img src="https://avatars3.githubusercontent.com/u/5456216?v=4" width="100px;"/><br /><sub><b>Cameron Edwards</b></sub>](http://cameronpedwards.com)<br />[💻](https://github.com/paypal/downshift/commits?author=cameronprattedwards "Code") [⚠️](https://github.com/paypal/downshift/commits?author=cameronprattedwards "Tests") | [<img src="https://avatars2.githubusercontent.com/u/179534?v=4" width="100px;"/><br /><sub><b>stereobooster</b></sub>](https://github.com/stereobooster)<br />[💻](https://github.com/paypal/downshift/commits?author=stereobooster "Code") [⚠️](https://github.com/paypal/downshift/commits?author=stereobooster "Tests") | [<img src="https://avatars0.githubusercontent.com/u/934879?v=4" width="100px;"/><br /><sub><b>Trevor Pierce</b></sub>](https://github.com/1Copenut)<br />[👀](#review-1Copenut "Reviewed Pull Requests") | [<img src="https://avatars1.githubusercontent.com/u/1334982?v=4" width="100px;"/><br /><sub><b>Xuefei Li</b></sub>](http://xuefei-frank.com)<br />[💻](https://github.com/paypal/downshift/commits?author=franklixuefei "Code") | [<img src="https://avatars0.githubusercontent.com/u/7252803?v=4" width="100px;"/><br /><sub><b>Alfred Ringstad</b></sub>](https://hyperlab.se)<br />[💻](https://github.com/paypal/downshift/commits?author=alfredringstad "Code") | [<img src="https://avatars0.githubusercontent.com/u/6895497?v=4" width="100px;"/><br /><sub><b>D[oa]vid Weisz</b></sub>](https://github.com/dovidweisz)<br />[💻](https://github.com/paypal/downshift/commits?author=dovidweisz "Code") | [<img src="https://avatars0.githubusercontent.com/u/19773?v=4" width="100px;"/><br /><sub><b>Royston Shufflebotham</b></sub>](https://github.com/RoystonS)<br />[🐛](https://github.com/paypal/downshift/issues?q=author%3ARoystonS "Bug reports") [💻](https://github.com/paypal/downshift/commits?author=RoystonS "Code") |
 | [<img src="https://avatars3.githubusercontent.com/u/6643991?v=4" width="100px;"/><br /><sub><b>Michaël De Boey</b></sub>](http://michaeldeboey.be)<br />[💻](https://github.com/paypal/downshift/commits?author=MichaelDeBoey "Code") | [<img src="https://avatars3.githubusercontent.com/u/4412771?v=4" width="100px;"/><br /><sub><b>Henry</b></sub>](https://github.com/EricHenry)<br />[💻](https://github.com/paypal/downshift/commits?author=EricHenry "Code") | [<img src="https://avatars3.githubusercontent.com/u/2180127?v=4" width="100px;"/><br /><sub><b>Andrew Walton</b></sub>](http://www.greenarrow.me)<br />[🐛](https://github.com/paypal/downshift/issues?q=author%3Agreen-arrow "Bug reports") [💻](https://github.com/paypal/downshift/commits?author=green-arrow "Code") [⚠️](https://github.com/paypal/downshift/commits?author=green-arrow "Tests") | [<img src="https://avatars0.githubusercontent.com/u/13774309?v=4" width="100px;"/><br /><sub><b>Arthur Denner</b></sub>](https://github.com/arthurdenner)<br />[💻](https://github.com/paypal/downshift/commits?author=arthurdenner "Code") | [<img src="https://avatars2.githubusercontent.com/u/81981?v=4" width="100px;"/><br /><sub><b>Cody Olsen</b></sub>](http://twitter.com/stipsan)<br />[💻](https://github.com/paypal/downshift/commits?author=stipsan "Code") | [<img src="https://avatars0.githubusercontent.com/u/5084492?v=4" width="100px;"/><br /><sub><b>Thomas Ladd</b></sub>](https://github.com/TLadd)<br />[💻](https://github.com/paypal/downshift/commits?author=TLadd "Code") | [<img src="https://avatars3.githubusercontent.com/u/34634369?v=4" width="100px;"/><br /><sub><b>lixualinta</b></sub>](https://github.com/lixualinta)<br />[💻](https://github.com/paypal/downshift/commits?author=lixualinta "Code") |
 | [<img src="https://avatars2.githubusercontent.com/u/2118956?v=4" width="100px;"/><br /><sub><b>Jacob Cofman</b></sub>](https://twitter.com/JCofman)<br />[💻](https://github.com/paypal/downshift/commits?author=JCofman "Code") | [<img src="https://avatars3.githubusercontent.com/u/19275184?v=4" width="100px;"/><br /><sub><b>Joshua Freedman</b></sub>](https://github.com/jf248)<br />[💻](https://github.com/paypal/downshift/commits?author=jf248 "Code") | [<img src="https://avatars1.githubusercontent.com/u/24494020?v=4" width="100px;"/><br /><sub><b>Amy</b></sub>](https://github.com/AmyScript)<br />[💡](#example-AmyScript "Examples") | [<img src="https://avatars1.githubusercontent.com/u/9063669?v=4" width="100px;"/><br /><sub><b>Rogin Farrer</b></sub>](http://twitter.com/roginfarrer)<br />[💻](https://github.com/paypal/downshift/commits?author=roginfarrer "Code") | [<img src="https://avatars3.githubusercontent.com/u/871583" width="100px;"/><br /><sub><b>Dmitrii Kanatnikov</b></sub>](https://github.com/rifler)<br />[💻](https://github.com/paypal/downshift/commits?author=rifler "Code") | [<img src="https://avatars2.githubusercontent.com/u/346300?v=4" width="100px;"/><br /><sub><b>Dallon Feldner</b></sub>](https://github.com/dallonf)<br />[🐛](https://github.com/paypal/downshift/issues?q=author%3Adallonf "Bug reports") [💻](https://github.com/paypal/downshift/commits?author=dallonf "Code") | [<img src="https://avatars2.githubusercontent.com/u/10165959?v=4" width="100px;"/><br /><sub><b>Samuel Fuller Thomas</b></sub>](https://samuelfullerthomas.com)<br />[💻](https://github.com/paypal/downshift/commits?author=samuelfullerthomas "Code") |
-| [<img src="https://avatars1.githubusercontent.com/u/2430381?v=4" width="100px;"/><br /><sub><b>Ryan Castner</b></sub>](http://audiolion.github.io)<br />[💻](https://github.com/paypal/downshift/commits?author=audiolion "Code") | [<img src="https://avatars2.githubusercontent.com/u/11275392?v=4" width="100px;"/><br /><sub><b>Silviu Alexandru Avram</b></sub>](https://github.com/silviuavram)<br />[🐛](https://github.com/paypal/downshift/issues?q=author%3Asilviuavram "Bug reports") [💻](https://github.com/paypal/downshift/commits?author=silviuavram "Code") [⚠️](https://github.com/paypal/downshift/commits?author=silviuavram "Tests") |
+| [<img src="https://avatars1.githubusercontent.com/u/2430381?v=4" width="100px;"/><br /><sub><b>Ryan Castner</b></sub>](http://audiolion.github.io)<br />[💻](https://github.com/paypal/downshift/commits?author=audiolion "Code") | [<img src="https://avatars2.githubusercontent.com/u/11275392?v=4" width="100px;"/><br /><sub><b>Silviu Alexandru Avram</b></sub>](https://github.com/silviuavram)<br />[🐛](https://github.com/paypal/downshift/issues?q=author%3Asilviuavram "Bug reports") [💻](https://github.com/paypal/downshift/commits?author=silviuavram "Code") [⚠️](https://github.com/paypal/downshift/commits?author=silviuavram "Tests") | [<img src="https://avatars1.githubusercontent.com/u/15676655?v=4" width="100px;"/><br /><sub><b>Anton Volkov</b></sub>](https://github.com/akronb)<br />[💻](https://github.com/paypal/downshift/commits?author=akronb "Code") [⚠️](https://github.com/paypal/downshift/commits?author=akronb "Tests") | [<img src="https://avatars3.githubusercontent.com/u/513363?v=4" width="100px;"/><br /><sub><b>Keegan Street</b></sub>](http://keegan.st)<br />[🐛](https://github.com/paypal/downshift/issues?q=author%3Akeeganstreet "Bug reports") [💻](https://github.com/paypal/downshift/commits?author=keeganstreet "Code") |
 
 <!-- ALL-CONTRIBUTORS-LIST:END -->
 

package/dist/downshift.cjs.js

@@ -12,6 +12,7 @@ var _assertThisInitialized = _interopDefault(require('@babel/runtime/helpers/ass
 var React = require('react');
 var React__default = _interopDefault(React);
 var PropTypes = _interopDefault(require('prop-types'));
+var reactIs = require('react-is');
 
 // istanbul ignore next
 var statusDiv = typeof document === 'undefined' ? null : document.getElementById('a11y-status-message');
@@ -97,7 +98,7 @@ var keyDownSpaceButton = process.env.NODE_ENV !== "production" ? '__autocomplete
 var clickButton = process.env.NODE_ENV !== "production" ? '__autocomplete_click_button__' : 11;
 var blurButton = process.env.NODE_ENV !== "production" ? '__autocomplete_blur_button__' : 12;
 var controlledPropUpdatedSelectedItem = process.env.NODE_ENV !== "production" ? '__autocomplete_controlled_prop_updated_selected_item__' : 13;
-var touchStart = process.env.NODE_ENV !== "production" ? '__autocomplete_touchstart__' : 14;
+var touchEnd = process.env.NODE_ENV !== "production" ? '__autocomplete_touchend__' : 14;
 
 var stateChangeTypes = /*#__PURE__*/Object.freeze({
   unknown: unknown,
@@ -114,7 +115,7 @@ var stateChangeTypes = /*#__PURE__*/Object.freeze({
   clickButton: clickButton,
   blurButton: blurButton,
   controlledPropUpdatedSelectedItem: controlledPropUpdatedSelectedItem,
-  touchStart: touchStart
+  touchEnd: touchEnd
 });
 
 var idCounter = 0;
@@ -1278,14 +1279,25 @@ function (_Component) {
       }; // Touching an element in iOS gives focus and hover states, but touching out of
       // the element will remove hover, and persist the focus state, resulting in the
       // blur event not being triggered.
+      // 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
 
 
-      var onTouchStart = function (event) {
+      var onTouchStart = function () {
+        _this4.isTouchMove = false;
+      };
+
+      var onTouchMove = function () {
+        _this4.isTouchMove = true;
+      };
+
+      var onTouchEnd = function (event) {
         var contextWithinDownshift = targetWithinDownshift(event.target, false);
 
-        if (!contextWithinDownshift && _this4.getState().isOpen) {
+        if (!_this4.isTouchMove && !contextWithinDownshift && _this4.getState().isOpen) {
           _this4.reset({
-            type: touchStart
+            type: touchEnd
           }, function () {
             return _this4.props.onOuterClick(_this4.getStateAndHelpers());
           });
@@ -1295,6 +1307,8 @@ function (_Component) {
       this.props.environment.addEventListener('mousedown', onMouseDown);
       this.props.environment.addEventListener('mouseup', onMouseUp);
       this.props.environment.addEventListener('touchstart', onTouchStart);
+      this.props.environment.addEventListener('touchmove', onTouchMove);
+      this.props.environment.addEventListener('touchend', onTouchEnd);
 
       this.cleanup = function () {
         _this4.internalClearTimeouts();
@@ -1306,6 +1320,10 @@ function (_Component) {
         _this4.props.environment.removeEventListener('mouseup', onMouseUp);
 
         _this4.props.environment.removeEventListener('touchstart', onTouchStart);
+
+        _this4.props.environment.removeEventListener('touchmove', onTouchMove);
+
+        _this4.props.environment.removeEventListener('touchend', onTouchEnd);
       };
     }
   };
@@ -1494,7 +1512,7 @@ function validateGetRootPropsCalledCorrectly(element, _ref11) {
   var refKeySpecified = refKey !== 'ref';
   var isComposite = !isDOMElement(element);
 
-  if (isComposite && !refKeySpecified) {
+  if (isComposite && !refKeySpecified && !reactIs.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) {
@@ -1502,7 +1520,7 @@ function validateGetRootPropsCalledCorrectly(element, _ref11) {
     console.error("downshift: You returned a DOM element. You should not specify a refKey in getRootProps. You specified \"" + refKey + "\"");
   }
 
-  if (!getElementProps(element)[refKey]) {
+  if (!reactIs.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.");
   }

package/dist/downshift.esm.js

@@ -5,6 +5,7 @@ import _inheritsLoose from '@babel/runtime/helpers/esm/inheritsLoose';
 import _assertThisInitialized from '@babel/runtime/helpers/esm/assertThisInitialized';
 import React, { Component } from 'react';
 import PropTypes from 'prop-types';
+import { isForwardRef } from 'react-is';
 
 // istanbul ignore next
 var statusDiv = typeof document === 'undefined' ? null : document.getElementById('a11y-status-message');
@@ -90,7 +91,7 @@ var keyDownSpaceButton = process.env.NODE_ENV !== "production" ? '__autocomplete
 var clickButton = process.env.NODE_ENV !== "production" ? '__autocomplete_click_button__' : 11;
 var blurButton = process.env.NODE_ENV !== "production" ? '__autocomplete_blur_button__' : 12;
 var controlledPropUpdatedSelectedItem = process.env.NODE_ENV !== "production" ? '__autocomplete_controlled_prop_updated_selected_item__' : 13;
-var touchStart = process.env.NODE_ENV !== "production" ? '__autocomplete_touchstart__' : 14;
+var touchEnd = process.env.NODE_ENV !== "production" ? '__autocomplete_touchend__' : 14;
 
 var stateChangeTypes = /*#__PURE__*/Object.freeze({
   unknown: unknown,
@@ -107,7 +108,7 @@ var stateChangeTypes = /*#__PURE__*/Object.freeze({
   clickButton: clickButton,
   blurButton: blurButton,
   controlledPropUpdatedSelectedItem: controlledPropUpdatedSelectedItem,
-  touchStart: touchStart
+  touchEnd: touchEnd
 });
 
 var idCounter = 0;
@@ -1271,14 +1272,25 @@ function (_Component) {
       }; // Touching an element in iOS gives focus and hover states, but touching out of
       // the element will remove hover, and persist the focus state, resulting in the
       // blur event not being triggered.
+      // 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
 
 
-      var onTouchStart = function (event) {
+      var onTouchStart = function () {
+        _this4.isTouchMove = false;
+      };
+
+      var onTouchMove = function () {
+        _this4.isTouchMove = true;
+      };
+
+      var onTouchEnd = function (event) {
         var contextWithinDownshift = targetWithinDownshift(event.target, false);
 
-        if (!contextWithinDownshift && _this4.getState().isOpen) {
+        if (!_this4.isTouchMove && !contextWithinDownshift && _this4.getState().isOpen) {
           _this4.reset({
-            type: touchStart
+            type: touchEnd
           }, function () {
             return _this4.props.onOuterClick(_this4.getStateAndHelpers());
           });
@@ -1288,6 +1300,8 @@ function (_Component) {
       this.props.environment.addEventListener('mousedown', onMouseDown);
       this.props.environment.addEventListener('mouseup', onMouseUp);
       this.props.environment.addEventListener('touchstart', onTouchStart);
+      this.props.environment.addEventListener('touchmove', onTouchMove);
+      this.props.environment.addEventListener('touchend', onTouchEnd);
 
       this.cleanup = function () {
         _this4.internalClearTimeouts();
@@ -1299,6 +1313,10 @@ function (_Component) {
         _this4.props.environment.removeEventListener('mouseup', onMouseUp);
 
         _this4.props.environment.removeEventListener('touchstart', onTouchStart);
+
+        _this4.props.environment.removeEventListener('touchmove', onTouchMove);
+
+        _this4.props.environment.removeEventListener('touchend', onTouchEnd);
       };
     }
   };
@@ -1487,7 +1505,7 @@ function validateGetRootPropsCalledCorrectly(element, _ref11) {
   var refKeySpecified = refKey !== 'ref';
   var isComposite = !isDOMElement(element);
 
-  if (isComposite && !refKeySpecified) {
+  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) {
@@ -1495,7 +1513,7 @@ function validateGetRootPropsCalledCorrectly(element, _ref11) {
     console.error("downshift: You returned a DOM element. You should not specify a refKey in getRootProps. You specified \"" + refKey + "\"");
   }
 
-  if (!getElementProps(element)[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.");
   }

package/dist/downshift.native.cjs.js

@@ -12,6 +12,7 @@ var _assertThisInitialized = _interopDefault(require('@babel/runtime/helpers/ass
 var React = require('react');
 var React__default = _interopDefault(React);
 var PropTypes = _interopDefault(require('prop-types'));
+var reactIs = require('react-is');
 
 // istanbul ignore next
 var statusDiv = typeof document === 'undefined' ? null : document.getElementById('a11y-status-message');
@@ -97,7 +98,7 @@ var keyDownSpaceButton = process.env.NODE_ENV !== "production" ? '__autocomplete
 var clickButton = process.env.NODE_ENV !== "production" ? '__autocomplete_click_button__' : 11;
 var blurButton = process.env.NODE_ENV !== "production" ? '__autocomplete_blur_button__' : 12;
 var controlledPropUpdatedSelectedItem = process.env.NODE_ENV !== "production" ? '__autocomplete_controlled_prop_updated_selected_item__' : 13;
-var touchStart = process.env.NODE_ENV !== "production" ? '__autocomplete_touchstart__' : 14;
+var touchEnd = process.env.NODE_ENV !== "production" ? '__autocomplete_touchend__' : 14;
 
 var stateChangeTypes = /*#__PURE__*/Object.freeze({
   unknown: unknown,
@@ -114,7 +115,7 @@ var stateChangeTypes = /*#__PURE__*/Object.freeze({
   clickButton: clickButton,
   blurButton: blurButton,
   controlledPropUpdatedSelectedItem: controlledPropUpdatedSelectedItem,
-  touchStart: touchStart
+  touchEnd: touchEnd
 });
 
 var idCounter = 0;
@@ -1225,6 +1226,12 @@ function (_Component) {
     var _this4 = this;
 
     /* istanbul ignore if (react-native) */
+    if (process.env.NODE_ENV !== 'production' && !true && this.getMenuProps.called && !this.getMenuProps.suppressRefError) {
+      validateGetMenuPropsCalledCorrectly(this._menuNode, this.getMenuProps);
+    }
+    /* istanbul ignore if (react-native) */
+
+
     this.cleanup = function () {
       _this4.internalClearTimeouts();
     };
@@ -1394,12 +1401,21 @@ process.env.NODE_ENV !== "production" ? Downshift.propTypes = {
 
 } : void 0;
 
+function validateGetMenuPropsCalledCorrectly(node, _ref10) {
+  var refKey = _ref10.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.");
+  }
+}
+
 function validateGetRootPropsCalledCorrectly(element, _ref11) {
   var refKey = _ref11.refKey;
   var refKeySpecified = refKey !== 'ref';
   var isComposite = !isDOMElement(element);
 
-  if (isComposite && !refKeySpecified) {
+  if (isComposite && !refKeySpecified && !reactIs.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) {
@@ -1407,7 +1423,7 @@ function validateGetRootPropsCalledCorrectly(element, _ref11) {
     console.error("downshift: You returned a DOM element. You should not specify a refKey in getRootProps. You specified \"" + refKey + "\"");
   }
 
-  if (!getElementProps(element)[refKey]) {
+  if (!reactIs.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.");
   }

package/dist/downshift.umd.js

@@ -53,6 +53,10 @@
     return self;
   }
 
+  function unwrapExports (x) {
+  	return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x.default : x;
+  }
+
   function createCommonjsModule(fn, module) {
   	return module = { exports: {} }, fn(module, module.exports), module.exports;
   }
@@ -809,6 +813,269 @@
   }
   });
 
+  var reactIs_production_min = createCommonjsModule(function (module, exports) {
+  Object.defineProperty(exports,"__esModule",{value:!0});
+  var b="function"===typeof Symbol&&Symbol.for,c=b?Symbol.for("react.element"):60103,d=b?Symbol.for("react.portal"):60106,e=b?Symbol.for("react.fragment"):60107,f=b?Symbol.for("react.strict_mode"):60108,g=b?Symbol.for("react.profiler"):60114,h=b?Symbol.for("react.provider"):60109,k=b?Symbol.for("react.context"):60110,l=b?Symbol.for("react.async_mode"):60111,m=b?Symbol.for("react.concurrent_mode"):60111,n=b?Symbol.for("react.forward_ref"):60112,p=b?Symbol.for("react.suspense"):60113,r=b?Symbol.for("react.memo"):
+  60115,t=b?Symbol.for("react.lazy"):60116;function u(a){if("object"===typeof a&&null!==a){var q=a.$$typeof;switch(q){case c:switch(a=a.type,a){case l:case m:case e:case g:case f:return a;default:switch(a=a&&a.$$typeof,a){case k:case n:case h:return a;default:return q}}case d:return q}}}function v(a){return u(a)===m}exports.typeOf=u;exports.AsyncMode=l;exports.ConcurrentMode=m;exports.ContextConsumer=k;exports.ContextProvider=h;exports.Element=c;exports.ForwardRef=n;exports.Fragment=e;
+  exports.Profiler=g;exports.Portal=d;exports.StrictMode=f;exports.isValidElementType=function(a){return "string"===typeof a||"function"===typeof a||a===e||a===m||a===g||a===f||a===p||"object"===typeof a&&null!==a&&(a.$$typeof===t||a.$$typeof===r||a.$$typeof===h||a.$$typeof===k||a.$$typeof===n)};exports.isAsyncMode=function(a){return v(a)||u(a)===l};exports.isConcurrentMode=v;exports.isContextConsumer=function(a){return u(a)===k};exports.isContextProvider=function(a){return u(a)===h};
+  exports.isElement=function(a){return "object"===typeof a&&null!==a&&a.$$typeof===c};exports.isForwardRef=function(a){return u(a)===n};exports.isFragment=function(a){return u(a)===e};exports.isProfiler=function(a){return u(a)===g};exports.isPortal=function(a){return u(a)===d};exports.isStrictMode=function(a){return u(a)===f};
+  });
+
+  unwrapExports(reactIs_production_min);
+  var reactIs_production_min_1 = reactIs_production_min.typeOf;
+  var reactIs_production_min_2 = reactIs_production_min.AsyncMode;
+  var reactIs_production_min_3 = reactIs_production_min.ConcurrentMode;
+  var reactIs_production_min_4 = reactIs_production_min.ContextConsumer;
+  var reactIs_production_min_5 = reactIs_production_min.ContextProvider;
+  var reactIs_production_min_6 = reactIs_production_min.Element;
+  var reactIs_production_min_7 = reactIs_production_min.ForwardRef;
+  var reactIs_production_min_8 = reactIs_production_min.Fragment;
+  var reactIs_production_min_9 = reactIs_production_min.Profiler;
+  var reactIs_production_min_10 = reactIs_production_min.Portal;
+  var reactIs_production_min_11 = reactIs_production_min.StrictMode;
+  var reactIs_production_min_12 = reactIs_production_min.isValidElementType;
+  var reactIs_production_min_13 = reactIs_production_min.isAsyncMode;
+  var reactIs_production_min_14 = reactIs_production_min.isConcurrentMode;
+  var reactIs_production_min_15 = reactIs_production_min.isContextConsumer;
+  var reactIs_production_min_16 = reactIs_production_min.isContextProvider;
+  var reactIs_production_min_17 = reactIs_production_min.isElement;
+  var reactIs_production_min_18 = reactIs_production_min.isForwardRef;
+  var reactIs_production_min_19 = reactIs_production_min.isFragment;
+  var reactIs_production_min_20 = reactIs_production_min.isProfiler;
+  var reactIs_production_min_21 = reactIs_production_min.isPortal;
+  var reactIs_production_min_22 = reactIs_production_min.isStrictMode;
+
+  var reactIs_development = createCommonjsModule(function (module, exports) {
+
+
+
+  {
+    (function() {
+
+  Object.defineProperty(exports, '__esModule', { value: true });
+
+  // The Symbol used to tag the ReactElement-like types. If there is no native Symbol
+  // nor polyfill, then a plain number is used for performance.
+  var hasSymbol = typeof Symbol === 'function' && Symbol.for;
+
+  var REACT_ELEMENT_TYPE = hasSymbol ? Symbol.for('react.element') : 0xeac7;
+  var REACT_PORTAL_TYPE = hasSymbol ? Symbol.for('react.portal') : 0xeaca;
+  var REACT_FRAGMENT_TYPE = hasSymbol ? Symbol.for('react.fragment') : 0xeacb;
+  var REACT_STRICT_MODE_TYPE = hasSymbol ? Symbol.for('react.strict_mode') : 0xeacc;
+  var REACT_PROFILER_TYPE = hasSymbol ? Symbol.for('react.profiler') : 0xead2;
+  var REACT_PROVIDER_TYPE = hasSymbol ? Symbol.for('react.provider') : 0xeacd;
+  var REACT_CONTEXT_TYPE = hasSymbol ? Symbol.for('react.context') : 0xeace;
+  var REACT_ASYNC_MODE_TYPE = hasSymbol ? Symbol.for('react.async_mode') : 0xeacf;
+  var REACT_CONCURRENT_MODE_TYPE = hasSymbol ? Symbol.for('react.concurrent_mode') : 0xeacf;
+  var REACT_FORWARD_REF_TYPE = hasSymbol ? Symbol.for('react.forward_ref') : 0xead0;
+  var REACT_SUSPENSE_TYPE = hasSymbol ? Symbol.for('react.suspense') : 0xead1;
+  var REACT_MEMO_TYPE = hasSymbol ? Symbol.for('react.memo') : 0xead3;
+  var REACT_LAZY_TYPE = hasSymbol ? Symbol.for('react.lazy') : 0xead4;
+
+  function isValidElementType(type) {
+    return typeof type === 'string' || typeof type === 'function' ||
+    // Note: its typeof might be other than 'symbol' or 'number' if it's a polyfill.
+    type === REACT_FRAGMENT_TYPE || type === REACT_CONCURRENT_MODE_TYPE || type === REACT_PROFILER_TYPE || type === REACT_STRICT_MODE_TYPE || type === REACT_SUSPENSE_TYPE || typeof type === 'object' && type !== null && (type.$$typeof === REACT_LAZY_TYPE || type.$$typeof === REACT_MEMO_TYPE || type.$$typeof === REACT_PROVIDER_TYPE || type.$$typeof === REACT_CONTEXT_TYPE || type.$$typeof === REACT_FORWARD_REF_TYPE);
+  }
+
+  /**
+   * Forked from fbjs/warning:
+   * https://github.com/facebook/fbjs/blob/e66ba20ad5be433eb54423f2b097d829324d9de6/packages/fbjs/src/__forks__/warning.js
+   *
+   * Only change is we use console.warn instead of console.error,
+   * and do nothing when 'console' is not supported.
+   * This really simplifies the code.
+   * ---
+   * Similar to invariant but only logs a warning if the condition is not met.
+   * This can be used to log issues in development environments in critical
+   * paths. Removing the logging code for production environments will keep the
+   * same logic and follow the same code paths.
+   */
+
+  var lowPriorityWarning = function () {};
+
+  {
+    var printWarning = function (format) {
+      for (var _len = arguments.length, args = Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
+        args[_key - 1] = arguments[_key];
+      }
+
+      var argIndex = 0;
+      var message = 'Warning: ' + format.replace(/%s/g, function () {
+        return args[argIndex++];
+      });
+      if (typeof console !== 'undefined') {
+        console.warn(message);
+      }
+      try {
+        // --- Welcome to debugging React ---
+        // This error was thrown as a convenience so that you can use this stack
+        // to find the callsite that caused this warning to fire.
+        throw new Error(message);
+      } catch (x) {}
+    };
+
+    lowPriorityWarning = function (condition, format) {
+      if (format === undefined) {
+        throw new Error('`lowPriorityWarning(condition, format, ...args)` requires a warning ' + 'message argument');
+      }
+      if (!condition) {
+        for (var _len2 = arguments.length, args = Array(_len2 > 2 ? _len2 - 2 : 0), _key2 = 2; _key2 < _len2; _key2++) {
+          args[_key2 - 2] = arguments[_key2];
+        }
+
+        printWarning.apply(undefined, [format].concat(args));
+      }
+    };
+  }
+
+  var lowPriorityWarning$1 = lowPriorityWarning;
+
+  function typeOf(object) {
+    if (typeof object === 'object' && object !== null) {
+      var $$typeof = object.$$typeof;
+
+      switch ($$typeof) {
+        case REACT_ELEMENT_TYPE:
+          var type = object.type;
+
+          switch (type) {
+            case REACT_ASYNC_MODE_TYPE:
+            case REACT_CONCURRENT_MODE_TYPE:
+            case REACT_FRAGMENT_TYPE:
+            case REACT_PROFILER_TYPE:
+            case REACT_STRICT_MODE_TYPE:
+              return type;
+            default:
+              var $$typeofType = type && type.$$typeof;
+
+              switch ($$typeofType) {
+                case REACT_CONTEXT_TYPE:
+                case REACT_FORWARD_REF_TYPE:
+                case REACT_PROVIDER_TYPE:
+                  return $$typeofType;
+                default:
+                  return $$typeof;
+              }
+          }
+        case REACT_PORTAL_TYPE:
+          return $$typeof;
+      }
+    }
+
+    return undefined;
+  }
+
+  // AsyncMode is deprecated along with isAsyncMode
+  var AsyncMode = REACT_ASYNC_MODE_TYPE;
+  var ConcurrentMode = REACT_CONCURRENT_MODE_TYPE;
+  var ContextConsumer = REACT_CONTEXT_TYPE;
+  var ContextProvider = REACT_PROVIDER_TYPE;
+  var Element = REACT_ELEMENT_TYPE;
+  var ForwardRef = REACT_FORWARD_REF_TYPE;
+  var Fragment = REACT_FRAGMENT_TYPE;
+  var Profiler = REACT_PROFILER_TYPE;
+  var Portal = REACT_PORTAL_TYPE;
+  var StrictMode = REACT_STRICT_MODE_TYPE;
+
+  var hasWarnedAboutDeprecatedIsAsyncMode = false;
+
+  // AsyncMode should be deprecated
+  function isAsyncMode(object) {
+    {
+      if (!hasWarnedAboutDeprecatedIsAsyncMode) {
+        hasWarnedAboutDeprecatedIsAsyncMode = true;
+        lowPriorityWarning$1(false, 'The ReactIs.isAsyncMode() alias has been deprecated, ' + 'and will be removed in React 17+. Update your code to use ' + 'ReactIs.isConcurrentMode() instead. It has the exact same API.');
+      }
+    }
+    return isConcurrentMode(object) || typeOf(object) === REACT_ASYNC_MODE_TYPE;
+  }
+  function isConcurrentMode(object) {
+    return typeOf(object) === REACT_CONCURRENT_MODE_TYPE;
+  }
+  function isContextConsumer(object) {
+    return typeOf(object) === REACT_CONTEXT_TYPE;
+  }
+  function isContextProvider(object) {
+    return typeOf(object) === REACT_PROVIDER_TYPE;
+  }
+  function isElement(object) {
+    return typeof object === 'object' && object !== null && object.$$typeof === REACT_ELEMENT_TYPE;
+  }
+  function isForwardRef(object) {
+    return typeOf(object) === REACT_FORWARD_REF_TYPE;
+  }
+  function isFragment(object) {
+    return typeOf(object) === REACT_FRAGMENT_TYPE;
+  }
+  function isProfiler(object) {
+    return typeOf(object) === REACT_PROFILER_TYPE;
+  }
+  function isPortal(object) {
+    return typeOf(object) === REACT_PORTAL_TYPE;
+  }
+  function isStrictMode(object) {
+    return typeOf(object) === REACT_STRICT_MODE_TYPE;
+  }
+
+  exports.typeOf = typeOf;
+  exports.AsyncMode = AsyncMode;
+  exports.ConcurrentMode = ConcurrentMode;
+  exports.ContextConsumer = ContextConsumer;
+  exports.ContextProvider = ContextProvider;
+  exports.Element = Element;
+  exports.ForwardRef = ForwardRef;
+  exports.Fragment = Fragment;
+  exports.Profiler = Profiler;
+  exports.Portal = Portal;
+  exports.StrictMode = StrictMode;
+  exports.isValidElementType = isValidElementType;
+  exports.isAsyncMode = isAsyncMode;
+  exports.isConcurrentMode = isConcurrentMode;
+  exports.isContextConsumer = isContextConsumer;
+  exports.isContextProvider = isContextProvider;
+  exports.isElement = isElement;
+  exports.isForwardRef = isForwardRef;
+  exports.isFragment = isFragment;
+  exports.isProfiler = isProfiler;
+  exports.isPortal = isPortal;
+  exports.isStrictMode = isStrictMode;
+    })();
+  }
+  });
+
+  unwrapExports(reactIs_development);
+  var reactIs_development_1 = reactIs_development.typeOf;
+  var reactIs_development_2 = reactIs_development.AsyncMode;
+  var reactIs_development_3 = reactIs_development.ConcurrentMode;
+  var reactIs_development_4 = reactIs_development.ContextConsumer;
+  var reactIs_development_5 = reactIs_development.ContextProvider;
+  var reactIs_development_6 = reactIs_development.Element;
+  var reactIs_development_7 = reactIs_development.ForwardRef;
+  var reactIs_development_8 = reactIs_development.Fragment;
+  var reactIs_development_9 = reactIs_development.Profiler;
+  var reactIs_development_10 = reactIs_development.Portal;
+  var reactIs_development_11 = reactIs_development.StrictMode;
+  var reactIs_development_12 = reactIs_development.isValidElementType;
+  var reactIs_development_13 = reactIs_development.isAsyncMode;
+  var reactIs_development_14 = reactIs_development.isConcurrentMode;
+  var reactIs_development_15 = reactIs_development.isContextConsumer;
+  var reactIs_development_16 = reactIs_development.isContextProvider;
+  var reactIs_development_17 = reactIs_development.isElement;
+  var reactIs_development_18 = reactIs_development.isForwardRef;
+  var reactIs_development_19 = reactIs_development.isFragment;
+  var reactIs_development_20 = reactIs_development.isProfiler;
+  var reactIs_development_21 = reactIs_development.isPortal;
+  var reactIs_development_22 = reactIs_development.isStrictMode;
+
+  var reactIs = createCommonjsModule(function (module) {
+
+  {
+    module.exports = reactIs_development;
+  }
+  });
+  var reactIs_1 = reactIs.isForwardRef;
+
   // istanbul ignore next
   var statusDiv = typeof document === 'undefined' ? null : document.getElementById('a11y-status-message');
   var statuses = [];
@@ -893,7 +1160,7 @@
   var clickButton = '__autocomplete_click_button__';
   var blurButton = '__autocomplete_blur_button__';
   var controlledPropUpdatedSelectedItem = '__autocomplete_controlled_prop_updated_selected_item__';
-  var touchStart = '__autocomplete_touchstart__';
+  var touchEnd = '__autocomplete_touchend__';
 
   var stateChangeTypes = /*#__PURE__*/Object.freeze({
     unknown: unknown,
@@ -910,7 +1177,7 @@
     clickButton: clickButton,
     blurButton: blurButton,
     controlledPropUpdatedSelectedItem: controlledPropUpdatedSelectedItem,
-    touchStart: touchStart
+    touchEnd: touchEnd
   });
 
   function isElement(el) {
@@ -2242,14 +2509,25 @@
         }; // Touching an element in iOS gives focus and hover states, but touching out of
         // the element will remove hover, and persist the focus state, resulting in the
         // blur event not being triggered.
+        // 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
 
 
-        var onTouchStart = function (event) {
+        var onTouchStart = function () {
+          _this4.isTouchMove = false;
+        };
+
+        var onTouchMove = function () {
+          _this4.isTouchMove = true;
+        };
+
+        var onTouchEnd = function (event) {
           var contextWithinDownshift = targetWithinDownshift(event.target, false);
 
-          if (!contextWithinDownshift && _this4.getState().isOpen) {
+          if (!_this4.isTouchMove && !contextWithinDownshift && _this4.getState().isOpen) {
             _this4.reset({
-              type: touchStart
+              type: touchEnd
             }, function () {
               return _this4.props.onOuterClick(_this4.getStateAndHelpers());
             });
@@ -2259,6 +2537,8 @@
         this.props.environment.addEventListener('mousedown', onMouseDown);
         this.props.environment.addEventListener('mouseup', onMouseUp);
         this.props.environment.addEventListener('touchstart', onTouchStart);
+        this.props.environment.addEventListener('touchmove', onTouchMove);
+        this.props.environment.addEventListener('touchend', onTouchEnd);
 
         this.cleanup = function () {
           _this4.internalClearTimeouts();
@@ -2270,6 +2550,10 @@
           _this4.props.environment.removeEventListener('mouseup', onMouseUp);
 
           _this4.props.environment.removeEventListener('touchstart', onTouchStart);
+
+          _this4.props.environment.removeEventListener('touchmove', onTouchMove);
+
+          _this4.props.environment.removeEventListener('touchend', onTouchEnd);
         };
       }
     };
@@ -2451,7 +2735,7 @@
     var refKeySpecified = refKey !== 'ref';
     var isComposite = !isDOMElement(element);
 
-    if (isComposite && !refKeySpecified) {
+    if (isComposite && !refKeySpecified && !reactIs_1(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) {
@@ -2459,7 +2743,7 @@
       console.error("downshift: You returned a DOM element. You should not specify a refKey in getRootProps. You specified \"" + refKey + "\"");
     }
 
-    if (!getElementProps(element)[refKey]) {
+    if (!reactIs_1(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.");
     }