@zendeskgarden/react-dropdowns 8.53.1 → 8.54.0

package/dist/index.cjs.js

@@ -446,7 +446,7 @@ var COMPONENT_ID$m = 'dropdowns.menu';
 var StyledMenu = styled__default["default"].ul.attrs(function (props) {
   return {
     'data-garden-id': COMPONENT_ID$m,
-    'data-garden-version': '8.53.1',
+    'data-garden-version': '8.54.0',
     className: props.isAnimated && 'is-animated'
   };
 }).withConfig({
@@ -471,7 +471,7 @@ var COMPONENT_ID$l = 'dropdowns.menu_wrapper';
 var StyledMenuWrapper = styled__default["default"].div.attrs(function (props) {
   return {
     'data-garden-id': COMPONENT_ID$l,
-    'data-garden-version': '8.53.1',
+    'data-garden-version': '8.54.0',
     className: props.isAnimated && 'is-animated'
   };
 }).withConfig({
@@ -495,7 +495,7 @@ StyledMenuWrapper.defaultProps = {
 var COMPONENT_ID$k = 'dropdowns.separator';
 var StyledSeparator = styled__default["default"].li.attrs({
   'data-garden-id': COMPONENT_ID$k,
-  'data-garden-version': '8.53.1',
+  'data-garden-version': '8.54.0',
   role: 'separator'
 }).withConfig({
   displayName: "StyledSeparator",
@@ -535,7 +535,7 @@ var getColorStyles = function getColorStyles(props) {
 var StyledItem = styled__default["default"].li.attrs(function (props) {
   return {
     'data-garden-id': COMPONENT_ID$j,
-    'data-garden-version': '8.53.1',
+    'data-garden-version': '8.54.0',
     'aria-disabled': props.disabled
   };
 }).withConfig({
@@ -565,7 +565,7 @@ StyledItem.defaultProps = {
 var COMPONENT_ID$i = 'dropdowns.add_item';
 var StyledAddItem = styled__default["default"](StyledItem).attrs({
   'data-garden-id': COMPONENT_ID$i,
-  'data-garden-version': '8.53.1'
+  'data-garden-version': '8.54.0'
 }).withConfig({
   displayName: "StyledAddItem",
   componentId: "sc-ekqk50-0"
@@ -581,7 +581,7 @@ StyledAddItem.defaultProps = {
 var COMPONENT_ID$h = 'dropdowns.item_meta';
 var StyledItemMeta = styled__default["default"].span.attrs({
   'data-garden-id': COMPONENT_ID$h,
-  'data-garden-version': '8.53.1'
+  'data-garden-version': '8.54.0'
 }).withConfig({
   displayName: "StyledItemMeta",
   componentId: "sc-k6xy28-0"
@@ -604,7 +604,7 @@ var getSizeStyles = function getSizeStyles(props) {
 };
 var StyledItemIcon = styled__default["default"].div.attrs({
   'data-garden-id': COMPONENT_ID$g,
-  'data-garden-version': '8.53.1'
+  'data-garden-version': '8.54.0'
 }).withConfig({
   displayName: "StyledItemIcon",
   componentId: "sc-1v0ty11-0"
@@ -630,7 +630,7 @@ StyledItemIcon.defaultProps = {
 var COMPONENT_ID$f = 'dropdowns.next_item';
 var StyledNextItem = styled__default["default"](StyledItem).attrs({
   'data-garden-id': COMPONENT_ID$f,
-  'data-garden-version': '8.53.1'
+  'data-garden-version': '8.54.0'
 }).withConfig({
   displayName: "StyledNextItem",
   componentId: "sc-1bcygn5-0"
@@ -668,7 +668,7 @@ var NextIconComponent = function NextIconComponent(_ref) {
   var className = _ref.className;
   return React__default["default"].createElement(SvgChevronRightStroke, {
     "data-garden-id": COMPONENT_ID$e,
-    "data-garden-version": '8.53.1',
+    "data-garden-version": '8.54.0',
     className: className
   });
 };
@@ -689,7 +689,7 @@ StyledNextIcon.defaultProps = {
 var COMPONENT_ID$d = 'dropdowns.previous_item';
 var StyledPreviousItem = styled__default["default"](StyledItem).attrs({
   'data-garden-id': COMPONENT_ID$d,
-  'data-garden-version': '8.53.1'
+  'data-garden-version': '8.54.0'
 }).withConfig({
   displayName: "StyledPreviousItem",
   componentId: "sc-1nmdds9-0"
@@ -725,7 +725,7 @@ var PreviousIconComponent = function PreviousIconComponent(_ref) {
   var className = _ref.className;
   return React__default["default"].createElement(SvgChevronLeftStroke, {
     "data-garden-id": COMPONENT_ID$c,
-    "data-garden-version": '8.53.1',
+    "data-garden-version": '8.54.0',
     className: className
   });
 };
@@ -746,7 +746,7 @@ StyledPreviousIcon.defaultProps = {
 var COMPONENT_ID$b = 'dropdowns.header_icon';
 var StyledHeaderIcon = styled__default["default"].div.attrs({
   'data-garden-id': COMPONENT_ID$b,
-  'data-garden-version': '8.53.1'
+  'data-garden-version': '8.54.0'
 }).withConfig({
   displayName: "StyledHeaderIcon",
   componentId: "sc-1fl6nsz-0"
@@ -776,7 +776,7 @@ var getHorizontalPadding = function getHorizontalPadding(props) {
 };
 var StyledHeaderItem = styled__default["default"](StyledItem).attrs({
   'data-garden-id': COMPONENT_ID$a,
-  'data-garden-version': '8.53.1'
+  'data-garden-version': '8.54.0'
 }).withConfig({
   displayName: "StyledHeaderItem",
   componentId: "sc-137filx-0"
@@ -796,7 +796,7 @@ StyledHeaderItem.defaultProps = {
 var COMPONENT_ID$9 = 'dropdowns.media_body';
 var StyledMediaBody = styled__default["default"].div.attrs({
   'data-garden-id': COMPONENT_ID$9,
-  'data-garden-version': '8.53.1'
+  'data-garden-version': '8.54.0'
 }).withConfig({
   displayName: "StyledMediaBody",
   componentId: "sc-36j7ef-0"
@@ -824,7 +824,7 @@ function (_ref) {
   );
 }).attrs({
   'data-garden-id': COMPONENT_ID$8,
-  'data-garden-version': '8.53.1'
+  'data-garden-version': '8.54.0'
 }).withConfig({
   displayName: "StyledMediaFigure",
   componentId: "sc-2f2x8x-0"
@@ -846,7 +846,7 @@ StyledMediaFigure.defaultProps = {
 var COMPONENT_ID$7 = 'dropdowns.media_item';
 var StyledMediaItem = styled__default["default"](StyledItem).attrs({
   'data-garden-id': COMPONENT_ID$7,
-  'data-garden-version': '8.53.1'
+  'data-garden-version': '8.54.0'
 }).withConfig({
   displayName: "StyledMediaItem",
   componentId: "sc-ikwshz-0"
@@ -861,7 +861,7 @@ var COMPONENT_ID$6 = 'dropdowns.faux_input';
 var StyledFauxInput = styled__default["default"](reactForms.FauxInput).attrs(function (props) {
   return {
     'data-garden-id': COMPONENT_ID$6,
-    'data-garden-version': '8.53.1',
+    'data-garden-version': '8.54.0',
     mediaLayout: true,
     theme: props.theme
   };
@@ -883,7 +883,7 @@ var COMPONENT_ID$5 = 'dropdowns.input';
 var hiddenStyling = styled.css(["position:fixed;border:0;clip:rect(1px,1px,1px,1px);padding:0;width:1px;height:1px;overflow:hidden;white-space:nowrap;"]);
 var StyledInput = styled__default["default"](reactForms.Input).attrs({
   'data-garden-id': COMPONENT_ID$5,
-  'data-garden-version': '8.53.1',
+  'data-garden-version': '8.54.0',
   isBare: true
 }).withConfig({
   displayName: "StyledInput",
@@ -900,7 +900,7 @@ StyledInput.defaultProps = {
 var COMPONENT_ID$4 = 'dropdowns.select';
 var StyledSelect = styled__default["default"].div.attrs({
   'data-garden-id': COMPONENT_ID$4,
-  'data-garden-version': '8.53.1'
+  'data-garden-version': '8.54.0'
 }).withConfig({
   displayName: "StyledSelect",
   componentId: "sc-xifmwj-0"
@@ -923,7 +923,7 @@ var visibleStyling = function visibleStyling(props) {
 };
 var StyledMultiselectInput = styled__default["default"](StyledInput).attrs({
   'data-garden-id': COMPONENT_ID$3,
-  'data-garden-version': '8.53.1'
+  'data-garden-version': '8.54.0'
 }).withConfig({
   displayName: "StyledMultiselectInput",
   componentId: "sc-1avnf6f-0"
@@ -953,7 +953,7 @@ var sizeStyles = function sizeStyles(props) {
 };
 var StyledMultiselectItemsContainer = styled__default["default"].div.attrs({
   'data-garden-id': COMPONENT_ID$2,
-  'data-garden-version': '8.53.1'
+  'data-garden-version': '8.54.0'
 }).withConfig({
   displayName: "StyledMultiselectItemsContainer",
   componentId: "sc-1jzhet8-0"
@@ -969,7 +969,7 @@ StyledMultiselectItemsContainer.defaultProps = {
 var COMPONENT_ID$1 = 'dropdowns.multiselect_item_wrapper';
 var StyledMultiselectItemWrapper = styled__default["default"].div.attrs({
   'data-garden-id': COMPONENT_ID$1,
-  'data-garden-version': '8.53.1'
+  'data-garden-version': '8.54.0'
 }).withConfig({
   displayName: "StyledMultiselectItemWrapper",
   componentId: "sc-1rb2bye-0"
@@ -985,7 +985,7 @@ StyledMultiselectItemWrapper.defaultProps = {
 var COMPONENT_ID = 'dropdowns.multiselect_more_anchor';
 var StyledMultiselectMoreAnchor = styled__default["default"].div.attrs({
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '8.53.1'
+  'data-garden-version': '8.54.0'
 }).withConfig({
   displayName: "StyledMultiselectMoreAnchor",
   componentId: "sc-1m9v46e-0"
@@ -1174,7 +1174,7 @@ var useFieldContext = function useFieldContext() {
 };
 
 var _excluded$9 = ["children", "inputRef", "start"],
-    _excluded2$4 = ["type"];
+    _excluded2$4 = ["type", "onKeyDown"];
 var Autocomplete = React.forwardRef(function (_ref, _ref3) {
   var children = _ref.children,
       controlledInputRef = _ref.inputRef,
@@ -1210,11 +1210,11 @@ var Autocomplete = React.forwardRef(function (_ref, _ref3) {
   var _getToggleButtonProps = getToggleButtonProps(getRootProps(_objectSpread2(_objectSpread2({
     role: null
   }, props), {}, {
-    onKeyDown: containerUtilities.composeEventHandlers(props.onKeyDown, function (e) {
+    onKeyDown: function onKeyDown(e) {
       if (isOpen) {
         e.nativeEvent.preventDownshiftDefault = true;
       }
-    }),
+    },
     onMouseEnter: containerUtilities.composeEventHandlers(props.onMouseEnter, function () {
       return setIsHovered(true);
     }),
@@ -1223,7 +1223,9 @@ var Autocomplete = React.forwardRef(function (_ref, _ref3) {
     })
   })));
       _getToggleButtonProps.type;
-      var selectProps = _objectWithoutProperties(_getToggleButtonProps, _excluded2$4);
+      var onKeyDown = _getToggleButtonProps.onKeyDown,
+      selectProps = _objectWithoutProperties(_getToggleButtonProps, _excluded2$4);
+  var onSelectKeyDown = containerUtilities.composeEventHandlers(props.onKeyDown, onKeyDown);
   var isContainerHovered = isLabelHovered && !isOpen;
   var isContainerFocused = isOpen || isFocused;
   React.useEffect(function () {
@@ -1234,7 +1236,8 @@ var Autocomplete = React.forwardRef(function (_ref, _ref3) {
     return React__default["default"].createElement(StyledFauxInput, _extends$5({
       isHovered: isContainerHovered,
       isFocused: isContainerFocused,
-      tabIndex: null
+      tabIndex: null,
+      onKeyDown: onSelectKeyDown
     }, selectProps, {
       ref: function ref(selectRef) {
         popperReference(selectRef);
@@ -1302,13 +1305,17 @@ var Combobox = React.forwardRef(function (_ref, ref) {
   var wrapperRef = React.useRef();
   var inputRef = React.useRef();
   var isOpenRef = React.useRef(isOpen);
-  var wrapperProps = getToggleButtonProps(getRootProps(_objectSpread2({
+  var wrapperProps = getToggleButtonProps(getRootProps(_objectSpread2(_objectSpread2({
     role: null,
     type: null,
     onClick: function onClick(event) {
       event.nativeEvent.preventDownshiftDefault = true;
     }
-  }, props)));
+  }, props), {}, {
+    onKeyDown: function onKeyDown(event) {
+      event.nativeEvent.preventDownshiftDefault = true;
+    }
+  })));
   var inputProps = getInputProps({
     isCompact: isCompact,
     isBare: isBare,

package/dist/index.esm.js

@@ -417,7 +417,7 @@ var COMPONENT_ID$m = 'dropdowns.menu';
 var StyledMenu = styled.ul.attrs(function (props) {
   return {
     'data-garden-id': COMPONENT_ID$m,
-    'data-garden-version': '8.53.1',
+    'data-garden-version': '8.54.0',
     className: props.isAnimated && 'is-animated'
   };
 }).withConfig({
@@ -442,7 +442,7 @@ var COMPONENT_ID$l = 'dropdowns.menu_wrapper';
 var StyledMenuWrapper = styled.div.attrs(function (props) {
   return {
     'data-garden-id': COMPONENT_ID$l,
-    'data-garden-version': '8.53.1',
+    'data-garden-version': '8.54.0',
     className: props.isAnimated && 'is-animated'
   };
 }).withConfig({
@@ -466,7 +466,7 @@ StyledMenuWrapper.defaultProps = {
 var COMPONENT_ID$k = 'dropdowns.separator';
 var StyledSeparator = styled.li.attrs({
   'data-garden-id': COMPONENT_ID$k,
-  'data-garden-version': '8.53.1',
+  'data-garden-version': '8.54.0',
   role: 'separator'
 }).withConfig({
   displayName: "StyledSeparator",
@@ -506,7 +506,7 @@ var getColorStyles = function getColorStyles(props) {
 var StyledItem = styled.li.attrs(function (props) {
   return {
     'data-garden-id': COMPONENT_ID$j,
-    'data-garden-version': '8.53.1',
+    'data-garden-version': '8.54.0',
     'aria-disabled': props.disabled
   };
 }).withConfig({
@@ -536,7 +536,7 @@ StyledItem.defaultProps = {
 var COMPONENT_ID$i = 'dropdowns.add_item';
 var StyledAddItem = styled(StyledItem).attrs({
   'data-garden-id': COMPONENT_ID$i,
-  'data-garden-version': '8.53.1'
+  'data-garden-version': '8.54.0'
 }).withConfig({
   displayName: "StyledAddItem",
   componentId: "sc-ekqk50-0"
@@ -552,7 +552,7 @@ StyledAddItem.defaultProps = {
 var COMPONENT_ID$h = 'dropdowns.item_meta';
 var StyledItemMeta = styled.span.attrs({
   'data-garden-id': COMPONENT_ID$h,
-  'data-garden-version': '8.53.1'
+  'data-garden-version': '8.54.0'
 }).withConfig({
   displayName: "StyledItemMeta",
   componentId: "sc-k6xy28-0"
@@ -575,7 +575,7 @@ var getSizeStyles = function getSizeStyles(props) {
 };
 var StyledItemIcon = styled.div.attrs({
   'data-garden-id': COMPONENT_ID$g,
-  'data-garden-version': '8.53.1'
+  'data-garden-version': '8.54.0'
 }).withConfig({
   displayName: "StyledItemIcon",
   componentId: "sc-1v0ty11-0"
@@ -601,7 +601,7 @@ StyledItemIcon.defaultProps = {
 var COMPONENT_ID$f = 'dropdowns.next_item';
 var StyledNextItem = styled(StyledItem).attrs({
   'data-garden-id': COMPONENT_ID$f,
-  'data-garden-version': '8.53.1'
+  'data-garden-version': '8.54.0'
 }).withConfig({
   displayName: "StyledNextItem",
   componentId: "sc-1bcygn5-0"
@@ -639,7 +639,7 @@ var NextIconComponent = function NextIconComponent(_ref) {
   var className = _ref.className;
   return React__default.createElement(SvgChevronRightStroke, {
     "data-garden-id": COMPONENT_ID$e,
-    "data-garden-version": '8.53.1',
+    "data-garden-version": '8.54.0',
     className: className
   });
 };
@@ -660,7 +660,7 @@ StyledNextIcon.defaultProps = {
 var COMPONENT_ID$d = 'dropdowns.previous_item';
 var StyledPreviousItem = styled(StyledItem).attrs({
   'data-garden-id': COMPONENT_ID$d,
-  'data-garden-version': '8.53.1'
+  'data-garden-version': '8.54.0'
 }).withConfig({
   displayName: "StyledPreviousItem",
   componentId: "sc-1nmdds9-0"
@@ -696,7 +696,7 @@ var PreviousIconComponent = function PreviousIconComponent(_ref) {
   var className = _ref.className;
   return React__default.createElement(SvgChevronLeftStroke, {
     "data-garden-id": COMPONENT_ID$c,
-    "data-garden-version": '8.53.1',
+    "data-garden-version": '8.54.0',
     className: className
   });
 };
@@ -717,7 +717,7 @@ StyledPreviousIcon.defaultProps = {
 var COMPONENT_ID$b = 'dropdowns.header_icon';
 var StyledHeaderIcon = styled.div.attrs({
   'data-garden-id': COMPONENT_ID$b,
-  'data-garden-version': '8.53.1'
+  'data-garden-version': '8.54.0'
 }).withConfig({
   displayName: "StyledHeaderIcon",
   componentId: "sc-1fl6nsz-0"
@@ -747,7 +747,7 @@ var getHorizontalPadding = function getHorizontalPadding(props) {
 };
 var StyledHeaderItem = styled(StyledItem).attrs({
   'data-garden-id': COMPONENT_ID$a,
-  'data-garden-version': '8.53.1'
+  'data-garden-version': '8.54.0'
 }).withConfig({
   displayName: "StyledHeaderItem",
   componentId: "sc-137filx-0"
@@ -767,7 +767,7 @@ StyledHeaderItem.defaultProps = {
 var COMPONENT_ID$9 = 'dropdowns.media_body';
 var StyledMediaBody = styled.div.attrs({
   'data-garden-id': COMPONENT_ID$9,
-  'data-garden-version': '8.53.1'
+  'data-garden-version': '8.54.0'
 }).withConfig({
   displayName: "StyledMediaBody",
   componentId: "sc-36j7ef-0"
@@ -795,7 +795,7 @@ function (_ref) {
   );
 }).attrs({
   'data-garden-id': COMPONENT_ID$8,
-  'data-garden-version': '8.53.1'
+  'data-garden-version': '8.54.0'
 }).withConfig({
   displayName: "StyledMediaFigure",
   componentId: "sc-2f2x8x-0"
@@ -817,7 +817,7 @@ StyledMediaFigure.defaultProps = {
 var COMPONENT_ID$7 = 'dropdowns.media_item';
 var StyledMediaItem = styled(StyledItem).attrs({
   'data-garden-id': COMPONENT_ID$7,
-  'data-garden-version': '8.53.1'
+  'data-garden-version': '8.54.0'
 }).withConfig({
   displayName: "StyledMediaItem",
   componentId: "sc-ikwshz-0"
@@ -832,7 +832,7 @@ var COMPONENT_ID$6 = 'dropdowns.faux_input';
 var StyledFauxInput = styled(FauxInput).attrs(function (props) {
   return {
     'data-garden-id': COMPONENT_ID$6,
-    'data-garden-version': '8.53.1',
+    'data-garden-version': '8.54.0',
     mediaLayout: true,
     theme: props.theme
   };
@@ -854,7 +854,7 @@ var COMPONENT_ID$5 = 'dropdowns.input';
 var hiddenStyling = css(["position:fixed;border:0;clip:rect(1px,1px,1px,1px);padding:0;width:1px;height:1px;overflow:hidden;white-space:nowrap;"]);
 var StyledInput = styled(Input).attrs({
   'data-garden-id': COMPONENT_ID$5,
-  'data-garden-version': '8.53.1',
+  'data-garden-version': '8.54.0',
   isBare: true
 }).withConfig({
   displayName: "StyledInput",
@@ -871,7 +871,7 @@ StyledInput.defaultProps = {
 var COMPONENT_ID$4 = 'dropdowns.select';
 var StyledSelect = styled.div.attrs({
   'data-garden-id': COMPONENT_ID$4,
-  'data-garden-version': '8.53.1'
+  'data-garden-version': '8.54.0'
 }).withConfig({
   displayName: "StyledSelect",
   componentId: "sc-xifmwj-0"
@@ -894,7 +894,7 @@ var visibleStyling = function visibleStyling(props) {
 };
 var StyledMultiselectInput = styled(StyledInput).attrs({
   'data-garden-id': COMPONENT_ID$3,
-  'data-garden-version': '8.53.1'
+  'data-garden-version': '8.54.0'
 }).withConfig({
   displayName: "StyledMultiselectInput",
   componentId: "sc-1avnf6f-0"
@@ -924,7 +924,7 @@ var sizeStyles = function sizeStyles(props) {
 };
 var StyledMultiselectItemsContainer = styled.div.attrs({
   'data-garden-id': COMPONENT_ID$2,
-  'data-garden-version': '8.53.1'
+  'data-garden-version': '8.54.0'
 }).withConfig({
   displayName: "StyledMultiselectItemsContainer",
   componentId: "sc-1jzhet8-0"
@@ -940,7 +940,7 @@ StyledMultiselectItemsContainer.defaultProps = {
 var COMPONENT_ID$1 = 'dropdowns.multiselect_item_wrapper';
 var StyledMultiselectItemWrapper = styled.div.attrs({
   'data-garden-id': COMPONENT_ID$1,
-  'data-garden-version': '8.53.1'
+  'data-garden-version': '8.54.0'
 }).withConfig({
   displayName: "StyledMultiselectItemWrapper",
   componentId: "sc-1rb2bye-0"
@@ -956,7 +956,7 @@ StyledMultiselectItemWrapper.defaultProps = {
 var COMPONENT_ID = 'dropdowns.multiselect_more_anchor';
 var StyledMultiselectMoreAnchor = styled.div.attrs({
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '8.53.1'
+  'data-garden-version': '8.54.0'
 }).withConfig({
   displayName: "StyledMultiselectMoreAnchor",
   componentId: "sc-1m9v46e-0"
@@ -1145,7 +1145,7 @@ var useFieldContext = function useFieldContext() {
 };
 
 var _excluded$9 = ["children", "inputRef", "start"],
-    _excluded2$4 = ["type"];
+    _excluded2$4 = ["type", "onKeyDown"];
 var Autocomplete = forwardRef(function (_ref, _ref3) {
   var children = _ref.children,
       controlledInputRef = _ref.inputRef,
@@ -1181,11 +1181,11 @@ var Autocomplete = forwardRef(function (_ref, _ref3) {
   var _getToggleButtonProps = getToggleButtonProps(getRootProps(_objectSpread2(_objectSpread2({
     role: null
   }, props), {}, {
-    onKeyDown: composeEventHandlers(props.onKeyDown, function (e) {
+    onKeyDown: function onKeyDown(e) {
       if (isOpen) {
         e.nativeEvent.preventDownshiftDefault = true;
       }
-    }),
+    },
     onMouseEnter: composeEventHandlers(props.onMouseEnter, function () {
       return setIsHovered(true);
     }),
@@ -1194,7 +1194,9 @@ var Autocomplete = forwardRef(function (_ref, _ref3) {
     })
   })));
       _getToggleButtonProps.type;
-      var selectProps = _objectWithoutProperties(_getToggleButtonProps, _excluded2$4);
+      var onKeyDown = _getToggleButtonProps.onKeyDown,
+      selectProps = _objectWithoutProperties(_getToggleButtonProps, _excluded2$4);
+  var onSelectKeyDown = composeEventHandlers(props.onKeyDown, onKeyDown);
   var isContainerHovered = isLabelHovered && !isOpen;
   var isContainerFocused = isOpen || isFocused;
   useEffect(function () {
@@ -1205,7 +1207,8 @@ var Autocomplete = forwardRef(function (_ref, _ref3) {
     return React__default.createElement(StyledFauxInput, _extends$5({
       isHovered: isContainerHovered,
       isFocused: isContainerFocused,
-      tabIndex: null
+      tabIndex: null,
+      onKeyDown: onSelectKeyDown
     }, selectProps, {
       ref: function ref(selectRef) {
         popperReference(selectRef);
@@ -1273,13 +1276,17 @@ var Combobox = forwardRef(function (_ref, ref) {
   var wrapperRef = useRef();
   var inputRef = useRef();
   var isOpenRef = useRef(isOpen);
-  var wrapperProps = getToggleButtonProps(getRootProps(_objectSpread2({
+  var wrapperProps = getToggleButtonProps(getRootProps(_objectSpread2(_objectSpread2({
     role: null,
     type: null,
     onClick: function onClick(event) {
       event.nativeEvent.preventDownshiftDefault = true;
     }
-  }, props)));
+  }, props), {}, {
+    onKeyDown: function onKeyDown(event) {
+      event.nativeEvent.preventDownshiftDefault = true;
+    }
+  })));
   var inputProps = getInputProps({
     isCompact: isCompact,
     isBare: isBare,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zendeskgarden/react-dropdowns",
-  "version": "8.53.1",
+  "version": "8.54.0",
   "description": "Components relating to dropdowns in the Garden Design System",
   "license": "Apache-2.0",
   "author": "Zendesk Garden <garden@zendesk.com>",
@@ -21,9 +21,9 @@
   "sideEffects": false,
   "types": "dist/typings/index.d.ts",
   "dependencies": {
-    "@zendeskgarden/container-selection": "^1.3.8",
-    "@zendeskgarden/container-utilities": "^0.7.0",
-    "@zendeskgarden/react-forms": "^8.53.1",
+    "@zendeskgarden/container-selection": "^2.0.0",
+    "@zendeskgarden/container-utilities": "^1.0.0",
+    "@zendeskgarden/react-forms": "^8.54.0",
     "downshift": "^6.0.0",
     "polished": "^4.0.0",
     "prop-types": "^15.5.7",
@@ -38,7 +38,7 @@
   },
   "devDependencies": {
     "@types/lodash.debounce": "4.0.7",
-    "@zendeskgarden/react-theming": "^8.53.1",
+    "@zendeskgarden/react-theming": "^8.54.0",
     "@zendeskgarden/svg-icons": "6.32.0",
     "lodash.debounce": "4.0.8"
   },
@@ -52,5 +52,5 @@
     "access": "public"
   },
   "zendeskgarden:src": "src/index.ts",
-  "gitHead": "79dee8e82b6f082e8d4a72ba95a5fb3982d63040"
+  "gitHead": "b3da3dce431c006759d20f8a2ae68716577f6839"
 }