downshift 7.2.2-alpha.0 → 7.2.2

package/dist/downshift.native.cjs.js

@@ -59,6 +59,17 @@ function scrollIntoView(node, menuNode) {
   });
 }
 
+/**
+ * @param {HTMLElement} parent the parent node
+ * @param {HTMLElement} child the child node
+ * @param {Window} environment The window context where downshift renders.
+ * @return {Boolean} whether the parent is the child or the child is in the parent
+ */
+function isOrContainsNode(parent, child, environment) {
+  var result = parent === child || child instanceof environment.Node && parent.contains && parent.contains(child);
+  return result;
+}
+
 /**
  * Simple debounce implementation. Will call the given
  * function once after the time given has passed since
@@ -351,6 +362,25 @@ function getNextNonDisabledIndex(moveAmount, baseIndex, itemCount, getItemNodeFr
   return -1;
 }
 
+/**
+ * Checks if event target is within the downshift elements.
+ *
+ * @param {EventTarget} target Target to check.
+ * @param {HTMLElement[]} downshiftElements The elements that form downshift (list, toggle button etc).
+ * @param {Window} environment The window context where downshift renders.
+ * @param {boolean} checkActiveElement Whether to also check activeElement.
+ *
+ * @returns {boolean} Whether or not the target is within downshift elements.
+ */
+function targetWithinDownshift(target, downshiftElements, environment, checkActiveElement) {
+  if (checkActiveElement === void 0) {
+    checkActiveElement = true;
+  }
+  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
 var validateControlledUnchanged = noop;
 /* istanbul ignore next */
@@ -480,9 +510,18 @@ var Downshift = /*#__PURE__*/function () {
       };
       _this.input = null;
       _this.items = [];
+      // itemCount can be changed asynchronously
+      // from within downshift (so it can't come from a prop)
+      // this is why we store it as an instance and use
+      // getItemCount rather than just use items.length
+      // (to support windowing + async)
       _this.itemCount = null;
       _this.previousResultCount = 0;
       _this.timeoutIds = [];
+      /**
+       * @param {Function} fn the function to call after the time
+       * @param {Number} time the time to wait
+       */
       _this.internalSetTimeout = function (fn, time) {
         var id = setTimeout(function () {
           _this.timeoutIds = _this.timeoutIds.filter(function (i) {
@@ -537,6 +576,14 @@ var Downshift = /*#__PURE__*/function () {
       _this.selectHighlightedItem = function (otherStateToSet, cb) {
         return _this.selectItemAtIndex(_this.getState().highlightedIndex, otherStateToSet, cb);
       };
+      // any piece of our state can live in two places:
+      // 1. Uncontrolled: it's internal (this.state)
+      //    We will call this.setState to update that state
+      // 2. Controlled: it's external (this.props)
+      //    We will call this.props.onStateChange to update that state
+      //
+      // In addition, we'll call this.props.onChange if the
+      // selectedItem is changed.
       _this.internalSetState = function (stateToSet, cb) {
         var isItemSelected, onChangeArg;
         var onStateChangeArg = {};
@@ -619,6 +666,7 @@ var Downshift = /*#__PURE__*/function () {
           _this.props.onUserAction(onStateChangeArg, _this.getStateAndHelpers());
         });
       };
+      //////////////////////////// ROOT
       _this.rootRef = function (node) {
         return _this._rootNode = node;
       };
@@ -641,6 +689,7 @@ var Downshift = /*#__PURE__*/function () {
           isOpen = _this$getState.isOpen;
         return _extends__default["default"]((_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);
       };
+      //\\\\\\\\\\\\\\\\\\\\\\\\\\ ROOT
       _this.keyDownHandlers = {
         ArrowDown: function ArrowDown(event) {
           var _this2 = this;
@@ -725,6 +774,7 @@ var Downshift = /*#__PURE__*/function () {
           }));
         }
       };
+      //////////////////////////// BUTTON
       _this.buttonKeyDownHandlers = _extends__default["default"]({}, _this.keyDownHandlers, {
         ' ': function _(event) {
           event.preventDefault();
@@ -840,12 +890,16 @@ var Downshift = /*#__PURE__*/function () {
           }
         });
       };
+      //\\\\\\\\\\\\\\\\\\\\\\\\\\\\\ BUTTON
+      /////////////////////////////// LABEL
       _this.getLabelProps = function (props) {
         return _extends__default["default"]({
           htmlFor: _this.inputId,
           id: _this.labelId
         }, props);
       };
+      //\\\\\\\\\\\\\\\\\\\\\\\\\\\\\ LABEL
+      /////////////////////////////// INPUT
       _this.getInputProps = function (_temp4) {
         var _ref4 = _temp4 === void 0 ? {} : _temp4,
           onKeyDown = _ref4.onKeyDown,
@@ -921,6 +975,8 @@ var Downshift = /*#__PURE__*/function () {
           }
         });
       };
+      //\\\\\\\\\\\\\\\\\\\\\\\\\\\\\ INPUT
+      /////////////////////////////// MENU
       _this.menuRef = function (node) {
         _this._menuNode = node;
       };
@@ -939,6 +995,8 @@ var Downshift = /*#__PURE__*/function () {
         _this.getMenuProps.suppressRefError = suppressRefError;
         return _extends__default["default"]((_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);
       };
+      //\\\\\\\\\\\\\\\\\\\\\\\\\\\\\ MENU
+      /////////////////////////////// ITEM
       _this.getItemProps = function (_temp7) {
         var _enabledEventHandlers;
         var _ref7 = _temp7 === void 0 ? {} : _temp7,
@@ -1002,6 +1060,7 @@ var Downshift = /*#__PURE__*/function () {
           'aria-selected': _this.getState().highlightedIndex === index
         }, eventHandlers, rest);
       };
+      //\\\\\\\\\\\\\\\\\\\\\\\\\\\\\ ITEM
       _this.clearItems = function () {
         _this.items = [];
       };
@@ -1204,10 +1263,7 @@ var Downshift = /*#__PURE__*/function () {
         isOpen: isOpen,
         selectedItem: selectedItem
       };
-    }
-
-    //////////////////////////// ROOT
-    ;
+    };
     _proto.componentDidMount = function componentDidMount() {
       var _this7 = this;
       /* istanbul ignore if (react-native) */
@@ -1497,6 +1553,9 @@ function getItemIndex(index, item, items) {
 function itemToString(item) {
   return item ? String(item) : '';
 }
+function isAcceptedCharacterKey(key) {
+  return /^\S{1}$/.test(key);
+}
 function capitalizeString(string) {
   return "" + string.slice(0, 1).toUpperCase() + string.slice(1);
 }
@@ -1652,10 +1711,50 @@ function useMouseAndTouchTracker(isOpen, downshiftElementRefs, environment, hand
     isTouchMove: false
   });
   react.useEffect(function () {
-    /* istanbul ignore if (react-native) */
-    {
+    if ((environment == null ? void 0 : environment.addEventListener) == null) {
       return;
     }
+
+    // The same strategy for checking if a click occurred inside or outside downshift
+    // as in downshift.js.
+    var onMouseDown = function onMouseDown() {
+      mouseAndTouchTrackersRef.current.isMouseDown = true;
+    };
+    var onMouseUp = function onMouseUp(event) {
+      mouseAndTouchTrackersRef.current.isMouseDown = false;
+      if (isOpen && !targetWithinDownshift(event.target, downshiftElementRefs.map(function (ref) {
+        return ref.current;
+      }), environment)) {
+        handleBlur();
+      }
+    };
+    var onTouchStart = function onTouchStart() {
+      mouseAndTouchTrackersRef.current.isTouchMove = false;
+    };
+    var onTouchMove = function onTouchMove() {
+      mouseAndTouchTrackersRef.current.isTouchMove = true;
+    };
+    var onTouchEnd = function onTouchEnd(event) {
+      if (isOpen && !mouseAndTouchTrackersRef.current.isTouchMove && !targetWithinDownshift(event.target, downshiftElementRefs.map(function (ref) {
+        return ref.current;
+      }), environment, false)) {
+        handleBlur();
+      }
+    };
+    environment.addEventListener('mousedown', onMouseDown);
+    environment.addEventListener('mouseup', onMouseUp);
+    environment.addEventListener('touchstart', onTouchStart);
+    environment.addEventListener('touchmove', onTouchMove);
+    environment.addEventListener('touchend', onTouchEnd);
+
+    // eslint-disable-next-line consistent-return
+    return function cleanup() {
+      environment.removeEventListener('mousedown', onMouseDown);
+      environment.removeEventListener('mouseup', onMouseUp);
+      environment.removeEventListener('touchstart', onTouchStart);
+      environment.removeEventListener('touchmove', onTouchMove);
+      environment.removeEventListener('touchend', onTouchEnd);
+    };
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [isOpen, environment]);
   return mouseAndTouchTrackersRef;
@@ -2084,8 +2183,8 @@ function downshiftSelectReducer(state, action) {
 /* eslint-enable complexity */
 
 var _excluded$2 = ["onMouseLeave", "refKey", "onKeyDown", "onBlur", "ref"],
-  _excluded2$2 = ["onBlur", "onClick", "onPress", "onKeyDown", "refKey", "ref"],
-  _excluded3$1 = ["item", "index", "onMouseMove", "onClick", "onPress", "refKey", "ref", "disabled"];
+  _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) {
@@ -2194,7 +2293,11 @@ function useSelect(userProps) {
     previousResultCountRef.current = items.length;
   });
   // Add mouse/touch events to document.
-  var mouseAndTouchTrackersRef = useMouseAndTouchTracker(isOpen, [menuRef, toggleButtonRef], environment);
+  var mouseAndTouchTrackersRef = useMouseAndTouchTracker(isOpen, [menuRef, toggleButtonRef], environment, function () {
+    dispatch({
+      type: ToggleButtonBlur
+    });
+  });
   var setGetterPropCallInfo = useGetterPropsCalledChecker('getMenuProps', 'getToggleButtonProps');
   // Make initial ref false.
   react.useEffect(function () {
@@ -2370,11 +2473,10 @@ function useSelect(userProps) {
   var getToggleButtonProps = react.useCallback(function (_temp3, _temp4) {
     var _extends3;
     var _ref3 = _temp3 === void 0 ? {} : _temp3,
-      onBlur = _ref3.onBlur;
-      _ref3.onClick;
-      var onPress = _ref3.onPress;
-      _ref3.onKeyDown;
-      var _ref3$refKey = _ref3.refKey,
+      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__default["default"](_ref3, _excluded2$2);
@@ -2394,14 +2496,24 @@ function useSelect(userProps) {
         });
       }
     };
+    var toggleButtonHandleKeyDown = function toggleButtonHandleKeyDown(event) {
+      var key = normalizeArrowKey(event);
+      if (key && toggleButtonKeyDownHandlers[key]) {
+        toggleButtonKeyDownHandlers[key](event);
+      } else if (isAcceptedCharacterKey(key)) {
+        dispatch({
+          type: ToggleButtonKeyDownCharacter,
+          key: key,
+          getItemNodeFromIndex: getItemNodeFromIndex
+        });
+      }
+    };
     var toggleProps = _extends__default["default"]((_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) {
-      /* istanbul ignore if (react-native) */
-      {
-        toggleProps.onPress = callAllEventHandlers(onPress, toggleButtonHandleClick);
-      }
+      toggleProps.onClick = callAllEventHandlers(onClick, toggleButtonHandleClick);
+      toggleProps.onKeyDown = callAllEventHandlers(onKeyDown, toggleButtonHandleKeyDown);
     }
     setGetterPropCallInfo('getToggleButtonProps', suppressRefError, refKey, toggleButtonRef);
     return toggleProps;
@@ -2411,9 +2523,8 @@ function useSelect(userProps) {
     var _ref5 = _temp5 === void 0 ? {} : _temp5,
       itemProp = _ref5.item,
       indexProp = _ref5.index,
-      onMouseMove = _ref5.onMouseMove;
-      _ref5.onClick;
-      var onPress = _ref5.onPress,
+      onMouseMove = _ref5.onMouseMove,
+      onClick = _ref5.onClick,
       _ref5$refKey = _ref5.refKey,
       refKey = _ref5$refKey === void 0 ? 'ref' : _ref5$refKey,
       ref = _ref5.ref,
@@ -2456,10 +2567,7 @@ function useSelect(userProps) {
       }
     }), _extends4), rest);
     if (!disabled) {
-      /* istanbul ignore next (react-native) */
-      {
-        itemProps.onPress = callAllEventHandlers(onPress, itemHandleClick);
-      }
+      itemProps.onClick = callAllEventHandlers(onClick, itemHandleClick);
     }
     itemProps.onMouseMove = callAllEventHandlers(onMouseMove, itemHandleMouseMove);
     return itemProps;
@@ -2855,7 +2963,12 @@ function useCombobox(userProps) {
     previousResultCountRef.current = items.length;
   });
   // Add mouse/touch events to document.
-  var mouseAndTouchTrackersRef = useMouseAndTouchTracker(isOpen, [inputRef, menuRef, toggleButtonRef], environment);
+  var mouseAndTouchTrackersRef = useMouseAndTouchTracker(isOpen, [inputRef, menuRef, toggleButtonRef], environment, function () {
+    dispatch({
+      type: InputBlur,
+      selectItem: false
+    });
+  });
   var setGetterPropCallInfo = useGetterPropsCalledChecker('getInputProps', 'getMenuProps');
   // Make initial ref false.
   react.useEffect(function () {
@@ -2866,13 +2979,14 @@ function useCombobox(userProps) {
   }, []);
   // Reset itemRefs on close.
   react.useEffect(function () {
+    var _environment$document;
     if (!isOpen) {
       itemRefs.current = {};
-    } else if (document.activeElement !== inputRef.current) {
+    } else if (((_environment$document = environment.document) == null ? void 0 : _environment$document.activeElement) !== inputRef.current) {
       var _inputRef$current;
       inputRef == null ? void 0 : (_inputRef$current = inputRef.current) == null ? void 0 : _inputRef$current.focus();
     }
-  }, [isOpen]);
+  }, [isOpen, environment]);
 
   /* Event handler functions */
   var inputKeyDownHandlers = react.useMemo(function () {

package/dist/downshift.umd.js

@@ -1803,9 +1803,18 @@
         };
         _this.input = null;
         _this.items = [];
+        // itemCount can be changed asynchronously
+        // from within downshift (so it can't come from a prop)
+        // this is why we store it as an instance and use
+        // getItemCount rather than just use items.length
+        // (to support windowing + async)
         _this.itemCount = null;
         _this.previousResultCount = 0;
         _this.timeoutIds = [];
+        /**
+         * @param {Function} fn the function to call after the time
+         * @param {Number} time the time to wait
+         */
         _this.internalSetTimeout = function (fn, time) {
           var id = setTimeout(function () {
             _this.timeoutIds = _this.timeoutIds.filter(function (i) {
@@ -1860,6 +1869,14 @@
         _this.selectHighlightedItem = function (otherStateToSet, cb) {
           return _this.selectItemAtIndex(_this.getState().highlightedIndex, otherStateToSet, cb);
         };
+        // any piece of our state can live in two places:
+        // 1. Uncontrolled: it's internal (this.state)
+        //    We will call this.setState to update that state
+        // 2. Controlled: it's external (this.props)
+        //    We will call this.props.onStateChange to update that state
+        //
+        // In addition, we'll call this.props.onChange if the
+        // selectedItem is changed.
         _this.internalSetState = function (stateToSet, cb) {
           var isItemSelected, onChangeArg;
           var onStateChangeArg = {};
@@ -1942,6 +1959,7 @@
             _this.props.onUserAction(onStateChangeArg, _this.getStateAndHelpers());
           });
         };
+        //////////////////////////// ROOT
         _this.rootRef = function (node) {
           return _this._rootNode = node;
         };
@@ -1964,6 +1982,7 @@
             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);
         };
+        //\\\\\\\\\\\\\\\\\\\\\\\\\\ ROOT
         _this.keyDownHandlers = {
           ArrowDown: function ArrowDown(event) {
             var _this2 = this;
@@ -2048,6 +2067,7 @@
             }));
           }
         };
+        //////////////////////////// BUTTON
         _this.buttonKeyDownHandlers = _extends({}, _this.keyDownHandlers, {
           ' ': function _(event) {
             event.preventDefault();
@@ -2167,12 +2187,16 @@
             }
           });
         };
+        //\\\\\\\\\\\\\\\\\\\\\\\\\\\\\ BUTTON
+        /////////////////////////////// LABEL
         _this.getLabelProps = function (props) {
           return _extends({
             htmlFor: _this.inputId,
             id: _this.labelId
           }, props);
         };
+        //\\\\\\\\\\\\\\\\\\\\\\\\\\\\\ LABEL
+        /////////////////////////////// INPUT
         _this.getInputProps = function (_temp4) {
           var _ref4 = _temp4 === void 0 ? {} : _temp4,
             onKeyDown = _ref4.onKeyDown,
@@ -2233,6 +2257,8 @@
             }
           });
         };
+        //\\\\\\\\\\\\\\\\\\\\\\\\\\\\\ INPUT
+        /////////////////////////////// MENU
         _this.menuRef = function (node) {
           _this._menuNode = node;
         };
@@ -2251,6 +2277,8 @@
           _this.getMenuProps.suppressRefError = suppressRefError;
           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);
         };
+        //\\\\\\\\\\\\\\\\\\\\\\\\\\\\\ MENU
+        /////////////////////////////// ITEM
         _this.getItemProps = function (_temp7) {
           var _enabledEventHandlers;
           var _ref7 = _temp7 === void 0 ? {} : _temp7,
@@ -2314,6 +2342,7 @@
             'aria-selected': _this.getState().highlightedIndex === index
           }, eventHandlers, rest);
         };
+        //\\\\\\\\\\\\\\\\\\\\\\\\\\\\\ ITEM
         _this.clearItems = function () {
           _this.items = [];
         };
@@ -2521,10 +2550,7 @@
           isOpen: isOpen,
           selectedItem: selectedItem
         };
-      }
-
-      //////////////////////////// ROOT
-      ;
+      };
       _proto.componentDidMount = function componentDidMount() {
         var _this7 = this;
         /* istanbul ignore if (react-native) */
@@ -3033,8 +3059,11 @@
       isTouchMove: false
     });
     react.useEffect(function () {
+      if ((environment == null ? void 0 : environment.addEventListener) == null) {
+        return;
+      }
 
-      // The same strategy for checking if a click occurred inside or outside downsift
+      // The same strategy for checking if a click occurred inside or outside downshift
       // as in downshift.js.
       var onMouseDown = function onMouseDown() {
         mouseAndTouchTrackersRef.current.isMouseDown = true;
@@ -3528,8 +3557,8 @@
   /* eslint-enable complexity */
 
   var _excluded$2 = ["onMouseLeave", "refKey", "onKeyDown", "onBlur", "ref"],
-    _excluded2$2 = ["onBlur", "onClick", "onPress", "onKeyDown", "refKey", "ref"],
-    _excluded3$1 = ["item", "index", "onMouseMove", "onClick", "onPress", "refKey", "ref", "disabled"];
+    _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) {
@@ -3819,9 +3848,8 @@
       var _extends3;
       var _ref3 = _temp3 === void 0 ? {} : _temp3,
         onBlur = _ref3.onBlur,
-        onClick = _ref3.onClick;
-        _ref3.onPress;
-        var onKeyDown = _ref3.onKeyDown,
+        onClick = _ref3.onClick,
+        onKeyDown = _ref3.onKeyDown,
         _ref3$refKey = _ref3.refKey,
         refKey = _ref3$refKey === void 0 ? 'ref' : _ref3$refKey,
         ref = _ref3.ref,
@@ -3858,11 +3886,8 @@
         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) {
-        /* istanbul ignore if (react-native) */
-        {
-          toggleProps.onClick = callAllEventHandlers(onClick, toggleButtonHandleClick);
-          toggleProps.onKeyDown = callAllEventHandlers(onKeyDown, toggleButtonHandleKeyDown);
-        }
+        toggleProps.onClick = callAllEventHandlers(onClick, toggleButtonHandleClick);
+        toggleProps.onKeyDown = callAllEventHandlers(onKeyDown, toggleButtonHandleKeyDown);
       }
       setGetterPropCallInfo('getToggleButtonProps', suppressRefError, refKey, toggleButtonRef);
       return toggleProps;
@@ -3873,9 +3898,8 @@
         itemProp = _ref5.item,
         indexProp = _ref5.index,
         onMouseMove = _ref5.onMouseMove,
-        onClick = _ref5.onClick;
-        _ref5.onPress;
-        var _ref5$refKey = _ref5.refKey,
+        onClick = _ref5.onClick,
+        _ref5$refKey = _ref5.refKey,
         refKey = _ref5$refKey === void 0 ? 'ref' : _ref5$refKey,
         ref = _ref5.ref,
         disabled = _ref5.disabled,
@@ -3917,10 +3941,7 @@
         }
       }), _extends4), rest);
       if (!disabled) {
-        /* istanbul ignore next (react-native) */
-        {
-          itemProps.onClick = callAllEventHandlers(onClick, itemHandleClick);
-        }
+        itemProps.onClick = callAllEventHandlers(onClick, itemHandleClick);
       }
       itemProps.onMouseMove = callAllEventHandlers(onMouseMove, itemHandleMouseMove);
       return itemProps;
@@ -4332,13 +4353,14 @@
     }, []);
     // Reset itemRefs on close.
     react.useEffect(function () {
+      var _environment$document;
       if (!isOpen) {
         itemRefs.current = {};
-      } else if (document.activeElement !== inputRef.current) {
+      } else if (((_environment$document = environment.document) == null ? void 0 : _environment$document.activeElement) !== inputRef.current) {
         var _inputRef$current;
         inputRef == null ? void 0 : (_inputRef$current = inputRef.current) == null ? void 0 : _inputRef$current.focus();
       }
-    }, [isOpen]);
+    }, [isOpen, environment]);
 
     /* Event handler functions */
     var inputKeyDownHandlers = react.useMemo(function () {