@zendeskgarden/react-dropdowns 8.49.2 → 8.50.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.49.2',
+    'data-garden-version': '8.50.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.49.2',
+    'data-garden-version': '8.50.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.49.2',
+  'data-garden-version': '8.50.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.49.2',
+    'data-garden-version': '8.50.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.49.2'
+  'data-garden-version': '8.50.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.49.2'
+  'data-garden-version': '8.50.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.49.2'
+  'data-garden-version': '8.50.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.49.2'
+  'data-garden-version': '8.50.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.49.2',
+    "data-garden-version": '8.50.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.49.2'
+  'data-garden-version': '8.50.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.49.2',
+    "data-garden-version": '8.50.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.49.2'
+  'data-garden-version': '8.50.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.49.2'
+  'data-garden-version': '8.50.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.49.2'
+  'data-garden-version': '8.50.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.49.2'
+  'data-garden-version': '8.50.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.49.2'
+  'data-garden-version': '8.50.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.49.2',
+    'data-garden-version': '8.50.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.49.2',
+  'data-garden-version': '8.50.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.49.2'
+  'data-garden-version': '8.50.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.49.2'
+  'data-garden-version': '8.50.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.49.2'
+  'data-garden-version': '8.50.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.49.2'
+  'data-garden-version': '8.50.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.49.2'
+  'data-garden-version': '8.50.0'
 }).withConfig({
   displayName: "StyledMultiselectMoreAnchor",
   componentId: "sc-1m9v46e-0"
@@ -1208,11 +1208,11 @@ var Autocomplete = React.forwardRef(function (_ref, _ref3) {
     previousIsOpenRef.current = isOpen;
   }, [inputRef, isOpen]);
   var _getToggleButtonProps = getToggleButtonProps(getRootProps(_objectSpread2({
-    onKeyDown: function onKeyDown(e) {
+    onKeyDown: containerUtilities.composeEventHandlers(props.onKeyDown, function (e) {
       if (isOpen) {
         e.nativeEvent.preventDownshiftDefault = true;
       }
-    },
+    }),
     onMouseEnter: containerUtilities.composeEventHandlers(props.onMouseEnter, function () {
       return setIsHovered(true);
     }),
@@ -1274,7 +1274,7 @@ Autocomplete.propTypes = {
   isBare: PropTypes__default["default"].bool,
   disabled: PropTypes__default["default"].bool,
   focusInset: PropTypes__default["default"].bool,
-  validation: PropTypes__default["default"].oneOf(['success', 'warning', 'error'])
+  validation: PropTypes__default["default"].oneOf(reactForms.VALIDATION)
 };
 
 var _excluded$8 = ["isCompact", "isBare", "disabled", "focusInset", "placeholder", "validation", "inputRef", "start", "end"];
@@ -1357,7 +1357,7 @@ Combobox.propTypes = {
   disabled: PropTypes__default["default"].bool,
   focusInset: PropTypes__default["default"].bool,
   placeholder: PropTypes__default["default"].string,
-  validation: PropTypes__default["default"].oneOf(['success', 'warning', 'error'])
+  validation: PropTypes__default["default"].oneOf(reactForms.VALIDATION)
 };
 
 var _excluded$7 = ["renderItem", "placeholder", "maxItems", "renderShowMore", "inputRef", "start", "onKeyDown"],
@@ -1797,7 +1797,8 @@ Select.propTypes = {
   isBare: PropTypes__default["default"].bool,
   disabled: PropTypes__default["default"].bool,
   focusInset: PropTypes__default["default"].bool,
-  validation: PropTypes__default["default"].oneOf(['success', 'warning', 'error'])
+  validation: PropTypes__default["default"].oneOf(reactForms.VALIDATION),
+  start: PropTypes__default["default"].any
 };
 
 var Field = React.forwardRef(function (props, fieldRef) {
@@ -1863,9 +1864,12 @@ var Message = React__default["default"].forwardRef(function (props, ref) {
 });
 Message.displayName = 'Message';
 Message.propTypes = {
-  validation: PropTypes__default["default"].oneOf(['success', 'warning', 'error'])
+  validation: PropTypes__default["default"].oneOf(reactForms.VALIDATION)
 };
 
+var SHARED_PLACEMENT = ['auto', 'top', 'top-start', 'top-end', 'bottom', 'bottom-start', 'bottom-end'];
+var PLACEMENT = [].concat(SHARED_PLACEMENT, ['end', 'end-top', 'end-bottom', 'start', 'start-top', 'start-bottom']);
+
 var MenuContext = React__default["default"].createContext(undefined);
 var useMenuContext = function useMenuContext() {
   var menuContext = React.useContext(MenuContext);
@@ -1981,7 +1985,7 @@ Menu.propTypes = {
   eventsEnabled: PropTypes__default["default"].bool,
   zIndex: PropTypes__default["default"].number,
   style: PropTypes__default["default"].object,
-  placement: PropTypes__default["default"].oneOf(['auto', 'top', 'top-start', 'top-end', 'end', 'end-top', 'end-bottom', 'bottom', 'bottom-start', 'bottom-end', 'start', 'start-top', 'start-bottom']),
+  placement: PropTypes__default["default"].oneOf(PLACEMENT),
   isAnimated: PropTypes__default["default"].bool,
   isCompact: PropTypes__default["default"].bool,
   hasArrow: PropTypes__default["default"].bool,

package/dist/index.esm.js

@@ -15,7 +15,7 @@ import { Manager, Reference, Popper } from 'react-popper';
 import { composeEventHandlers, KEY_CODES } from '@zendeskgarden/container-utilities';
 import { arrowStyles, retrieveComponentStyles, DEFAULT_THEME, menuStyles, getColor, getLineHeight } from '@zendeskgarden/react-theming';
 import { rgba, math } from 'polished';
-import { FauxInput, Input, MediaInput, Field as Field$1, Hint as Hint$1, Label as Label$1, Message as Message$1 } from '@zendeskgarden/react-forms';
+import { FauxInput, Input, VALIDATION, MediaInput, Field as Field$1, Hint as Hint$1, Label as Label$1, Message as Message$1 } from '@zendeskgarden/react-forms';
 import mergeRefs from 'react-merge-refs';
 import { useSelection } from '@zendeskgarden/container-selection';
 import { createPortal } from 'react-dom';
@@ -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.49.2',
+    'data-garden-version': '8.50.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.49.2',
+    'data-garden-version': '8.50.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.49.2',
+  'data-garden-version': '8.50.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.49.2',
+    'data-garden-version': '8.50.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.49.2'
+  'data-garden-version': '8.50.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.49.2'
+  'data-garden-version': '8.50.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.49.2'
+  'data-garden-version': '8.50.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.49.2'
+  'data-garden-version': '8.50.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.49.2',
+    "data-garden-version": '8.50.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.49.2'
+  'data-garden-version': '8.50.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.49.2',
+    "data-garden-version": '8.50.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.49.2'
+  'data-garden-version': '8.50.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.49.2'
+  'data-garden-version': '8.50.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.49.2'
+  'data-garden-version': '8.50.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.49.2'
+  'data-garden-version': '8.50.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.49.2'
+  'data-garden-version': '8.50.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.49.2',
+    'data-garden-version': '8.50.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.49.2',
+  'data-garden-version': '8.50.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.49.2'
+  'data-garden-version': '8.50.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.49.2'
+  'data-garden-version': '8.50.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.49.2'
+  'data-garden-version': '8.50.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.49.2'
+  'data-garden-version': '8.50.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.49.2'
+  'data-garden-version': '8.50.0'
 }).withConfig({
   displayName: "StyledMultiselectMoreAnchor",
   componentId: "sc-1m9v46e-0"
@@ -1179,11 +1179,11 @@ var Autocomplete = forwardRef(function (_ref, _ref3) {
     previousIsOpenRef.current = isOpen;
   }, [inputRef, isOpen]);
   var _getToggleButtonProps = getToggleButtonProps(getRootProps(_objectSpread2({
-    onKeyDown: function onKeyDown(e) {
+    onKeyDown: composeEventHandlers(props.onKeyDown, function (e) {
       if (isOpen) {
         e.nativeEvent.preventDownshiftDefault = true;
       }
-    },
+    }),
     onMouseEnter: composeEventHandlers(props.onMouseEnter, function () {
       return setIsHovered(true);
     }),
@@ -1245,7 +1245,7 @@ Autocomplete.propTypes = {
   isBare: PropTypes.bool,
   disabled: PropTypes.bool,
   focusInset: PropTypes.bool,
-  validation: PropTypes.oneOf(['success', 'warning', 'error'])
+  validation: PropTypes.oneOf(VALIDATION)
 };
 
 var _excluded$8 = ["isCompact", "isBare", "disabled", "focusInset", "placeholder", "validation", "inputRef", "start", "end"];
@@ -1328,7 +1328,7 @@ Combobox.propTypes = {
   disabled: PropTypes.bool,
   focusInset: PropTypes.bool,
   placeholder: PropTypes.string,
-  validation: PropTypes.oneOf(['success', 'warning', 'error'])
+  validation: PropTypes.oneOf(VALIDATION)
 };
 
 var _excluded$7 = ["renderItem", "placeholder", "maxItems", "renderShowMore", "inputRef", "start", "onKeyDown"],
@@ -1768,7 +1768,8 @@ Select.propTypes = {
   isBare: PropTypes.bool,
   disabled: PropTypes.bool,
   focusInset: PropTypes.bool,
-  validation: PropTypes.oneOf(['success', 'warning', 'error'])
+  validation: PropTypes.oneOf(VALIDATION),
+  start: PropTypes.any
 };
 
 var Field = forwardRef(function (props, fieldRef) {
@@ -1834,9 +1835,12 @@ var Message = React__default.forwardRef(function (props, ref) {
 });
 Message.displayName = 'Message';
 Message.propTypes = {
-  validation: PropTypes.oneOf(['success', 'warning', 'error'])
+  validation: PropTypes.oneOf(VALIDATION)
 };
 
+var SHARED_PLACEMENT = ['auto', 'top', 'top-start', 'top-end', 'bottom', 'bottom-start', 'bottom-end'];
+var PLACEMENT = [].concat(SHARED_PLACEMENT, ['end', 'end-top', 'end-bottom', 'start', 'start-top', 'start-bottom']);
+
 var MenuContext = React__default.createContext(undefined);
 var useMenuContext = function useMenuContext() {
   var menuContext = useContext(MenuContext);
@@ -1952,7 +1956,7 @@ Menu.propTypes = {
   eventsEnabled: PropTypes.bool,
   zIndex: PropTypes.number,
   style: PropTypes.object,
-  placement: PropTypes.oneOf(['auto', 'top', 'top-start', 'top-end', 'end', 'end-top', 'end-bottom', 'bottom', 'bottom-start', 'bottom-end', 'start', 'start-top', 'start-bottom']),
+  placement: PropTypes.oneOf(PLACEMENT),
   isAnimated: PropTypes.bool,
   isCompact: PropTypes.bool,
   hasArrow: PropTypes.bool,

package/dist/typings/elements/Autocomplete/Autocomplete.d.ts

@@ -4,24 +4,8 @@
  * Use of this source code is governed under the Apache License, Version 2.0
  * found at http://www.apache.org/licenses/LICENSE-2.0.
  */
-import React, { HTMLAttributes } from 'react';
-import { VALIDATION } from '../../utils/validation';
-export interface IAutocompleteProps extends HTMLAttributes<HTMLDivElement> {
-    /** Applies compact styling */
-    isCompact?: boolean;
-    /** Removes borders and padding */
-    isBare?: boolean;
-    /** Indicates that the element is not interactive */
-    disabled?: boolean;
-    /** Applies inset `box-shadow` styling on focus */
-    focusInset?: boolean;
-    /** Defines the element's validation state */
-    validation?: VALIDATION;
-    /** Provides ref access to the underlying input element */
-    inputRef?: React.Ref<HTMLInputElement>;
-    /** Defines the icon rendered in the start position */
-    start?: any;
-}
+import React from 'react';
+import { IAutocompleteProps } from '../../types';
 /**
  * @extends HTMLAttributes<HTMLDivElement>
  */

package/dist/typings/elements/Combobox/Combobox.d.ts

@@ -4,28 +4,8 @@
  * Use of this source code is governed under the Apache License, Version 2.0
  * found at http://www.apache.org/licenses/LICENSE-2.0.
  */
-import React, { HTMLAttributes } from 'react';
-import { VALIDATION } from '../../utils/validation';
-export interface IComboboxProps extends HTMLAttributes<HTMLDivElement> {
-    /** Applies compact styling */
-    isCompact?: boolean;
-    /** Removes borders and padding */
-    isBare?: boolean;
-    /** Indicates that the element is not interactive */
-    disabled?: boolean;
-    /** Applies inset `box-shadow` styling on focus */
-    focusInset?: boolean;
-    /** Defines text that appears in the element when no items are selected */
-    placeholder?: string;
-    /** Defines the element's validation state */
-    validation?: VALIDATION;
-    /** Provides ref access to the underlying input element */
-    inputRef?: React.Ref<HTMLInputElement>;
-    /** Defines the icon rendered in the start position */
-    start?: any;
-    /** Defines the icon rendered in the end position */
-    end?: any;
-}
+import React from 'react';
+import { IComboboxProps } from '../../types';
 /**
  * @extends HTMLAttributes<HTMLDivElement>
  */

package/dist/typings/elements/Dropdown/Dropdown.d.ts

@@ -6,43 +6,8 @@
  */
 import { PropsWithChildren } from 'react';
 import PropTypes from 'prop-types';
-import { ControllerStateAndHelpers, StateChangeOptions } from 'downshift';
+import { IDropdownProps } from '../../types';
 export declare const REMOVE_ITEM_STATE_TYPE = "REMOVE_ITEM";
-export interface IDropdownProps {
-    /** Opens the dropdown */
-    isOpen?: boolean;
-    /** Identifies the currently selected item */
-    selectedItem?: any;
-    /** Identifies the currently selected items */
-    selectedItems?: any[];
-    /** Highlights an element at a selected index */
-    highlightedIndex?: number;
-    /** Sets the value of the input element*/
-    inputValue?: string;
-    /**
-     * Handles item selection
-     *
-     * @param {any|null} selectedItem The selected item
-     * @param {Object} stateAndHelpers [Downshift state and helpers](https://github.com/downshift-js/downshift#onselect)
-     * */
-    onSelect?: (selectedItem: any | null, stateAndHelpers: ControllerStateAndHelpers<any>) => void;
-    /**
-     * Handles state change
-     *
-     * @param {Object} options [Downshift internal state changes](https://github.com/downshift-js/downshift#onstatechange)
-     * @param {Object} stateAndHelpers [Downshift state and helpers](https://github.com/downshift-js/downshift#onstatechange)
-     * */
-    onStateChange?: (options: StateChangeOptions<any>, stateAndHelpers: ControllerStateAndHelpers<any>) => void;
-    /**
-     * Handles input value change
-     *
-     * @param {string} inputValue Value of the input element
-     * @param {Object} stateAndHelpers [Downshift state and helpers](https://github.com/downshift-js/downshift#oninputvaluechange)
-     * */
-    onInputValueChange?: (inputValue: string, stateAndHelpers: ControllerStateAndHelpers<any>) => void;
-    /** Passes customization props to the [Downshift](https://www.downshift-js.com/) component */
-    downshiftProps?: Record<string, any>;
-}
 export declare const Dropdown: {
     (props: PropsWithChildren<IDropdownProps>): JSX.Element;
     propTypes: {

package/dist/typings/elements/Fields/Label.d.ts

@@ -4,11 +4,8 @@
  * Use of this source code is governed under the Apache License, Version 2.0
  * found at http://www.apache.org/licenses/LICENSE-2.0.
  */
-import React, { LabelHTMLAttributes } from 'react';
-export interface ILabelProps extends LabelHTMLAttributes<HTMLLabelElement> {
-    /** Applies regular (non-bold) font weight */
-    isRegular?: boolean;
-}
+import React from 'react';
+import { ILabelProps } from '@zendeskgarden/react-forms';
 /**
  * @extends LabelHTMLAttributes<HTMLLabelElement>
  */

package/dist/typings/elements/Fields/Message.d.ts

@@ -4,12 +4,8 @@
  * Use of this source code is governed under the Apache License, Version 2.0
  * found at http://www.apache.org/licenses/LICENSE-2.0.
  */
-import React, { HTMLAttributes } from 'react';
-import { VALIDATION } from '../../utils/validation';
-export interface IMessageProps extends HTMLAttributes<HTMLDivElement> {
-    /** Applies styles based on validation state */
-    validation?: VALIDATION;
-}
+import React from 'react';
+import { IMessageProps } from '@zendeskgarden/react-forms';
 /**
  * @extends HTMLAttributes<HTMLDivElement>
  */

package/dist/typings/elements/Menu/Items/AddItem.d.ts

@@ -5,7 +5,7 @@
  * found at http://www.apache.org/licenses/LICENSE-2.0.
  */
 import React from 'react';
-import { IItemProps } from './Item';
+import { IItemProps } from '../../../types';
 /**
  * @extends LiHTMLAttributes<HTMLLIElement>
  */

package/dist/typings/elements/Menu/Items/HeaderItem.d.ts

@@ -4,11 +4,8 @@
  * Use of this source code is governed under the Apache License, Version 2.0
  * found at http://www.apache.org/licenses/LICENSE-2.0.
  */
-import React, { LiHTMLAttributes } from 'react';
-export interface IHeaderItemProps extends LiHTMLAttributes<HTMLLIElement> {
-    /** Applies icon styling */
-    hasIcon?: boolean;
-}
+import React from 'react';
+import { IHeaderItemProps } from '../../../types';
 /**
  * @extends LiHTMLAttributes<HTMLLIElement>
  */

package/dist/typings/elements/Menu/Items/Item.d.ts

@@ -4,19 +4,8 @@
  * Use of this source code is governed under the Apache License, Version 2.0
  * found at http://www.apache.org/licenses/LICENSE-2.0.
  */
-import React, { LiHTMLAttributes } from 'react';
-export interface IItemProps extends LiHTMLAttributes<HTMLLIElement> {
-    /** Sets the value that is returned upon selection */
-    value?: any;
-    /**
-     * @ignore Sets the wrapping component for the item
-     */
-    component?: any;
-    /** Indicates that the element is not interactive */
-    disabled?: boolean;
-    /** Applies danger styling */
-    isDanger?: boolean;
-}
+import React from 'react';
+import { IItemProps } from '../../../types';
 /**
  * @extends LiHTMLAttributes<HTMLLIElement>
  */

package/dist/typings/elements/Menu/Items/MediaItem.d.ts

@@ -5,7 +5,7 @@
  * found at http://www.apache.org/licenses/LICENSE-2.0.
  */
 import React from 'react';
-import { IItemProps } from './Item';
+import { IItemProps } from '../../../types';
 /**
  * @extends LiHTMLAttributes<HTMLLIElement>
  */

package/dist/typings/elements/Menu/Items/NextItem.d.ts

@@ -5,7 +5,7 @@
  * found at http://www.apache.org/licenses/LICENSE-2.0.
  */
 import React from 'react';
-import { IItemProps } from './Item';
+import { IItemProps } from '../../../types';
 /**
  * @extends LiHTMLAttributes<HTMLLIElement>
  */

package/dist/typings/elements/Menu/Items/PreviousItem.d.ts

@@ -5,7 +5,7 @@
  * found at http://www.apache.org/licenses/LICENSE-2.0.
  */
 import React from 'react';
-import { IItemProps } from './Item';
+import { IItemProps } from '../../../types';
 /**
  * @extends LiHTMLAttributes<HTMLLIElement>
  */

package/dist/typings/elements/Menu/Menu.d.ts

@@ -4,47 +4,8 @@
  * Use of this source code is governed under the Apache License, Version 2.0
  * found at http://www.apache.org/licenses/LICENSE-2.0.
  */
-import React, { HTMLAttributes } from 'react';
-import { Modifiers } from 'popper.js';
-import { GARDEN_PLACEMENT } from '../../utils/garden-placements';
-export interface IMenuProps extends HTMLAttributes<HTMLUListElement> {
-    /**
-     * Passes configuration options to the [Popper instance](https://popper.js.org/docs/v2/modifiers/)
-     */
-    popperModifiers?: Modifiers;
-    /**
-     * Allows the menu to reposition during browser resize events
-     */
-    eventsEnabled?: boolean;
-    /**
-     * Sets the `z-index` of the menu
-     */
-    zIndex?: number;
-    /**
-     * Adjusts the placement of the menu
-     */
-    placement?: GARDEN_PLACEMENT;
-    /**
-     * Animates the menu
-     */
-    isAnimated?: boolean;
-    /**
-     * Applies compact styling
-     */
-    isCompact?: boolean;
-    /**
-     * Attaches an arrow that points towards the menu trigger
-     */
-    hasArrow?: boolean;
-    /**
-     * Sets the `max-height` of the menu
-     */
-    maxHeight?: string;
-    /**
-     * Appends the menu to the element provided
-     */
-    appendToNode?: HTMLElement;
-}
+import React from 'react';
+import { IMenuProps } from '../../types';
 /**
  * @extends HTMLAttributes<HTMLUListElement>
  */

package/dist/typings/elements/Multiselect/Multiselect.d.ts

@@ -4,47 +4,8 @@
  * Use of this source code is governed under the Apache License, Version 2.0
  * found at http://www.apache.org/licenses/LICENSE-2.0.
  */
-import React, { HTMLAttributes } from 'react';
-import { VALIDATION } from '../../utils/validation';
-export interface IMultiselectProps extends HTMLAttributes<HTMLDivElement> {
-    /** Applies compact styling */
-    isCompact?: boolean;
-    /** Removes borders and padding */
-    isBare?: boolean;
-    /** Indicates that the element is not interactive */
-    disabled?: boolean;
-    /** Applies inset `box-shadow` styling on focus */
-    focusInset?: boolean;
-    /** Defines text that appears in the element when no items are selected */
-    placeholder?: string;
-    /** Defines the element's validation state */
-    validation?: VALIDATION;
-    /** Determines the maximum number of items displayed while collapsed */
-    maxItems?: number;
-    /**
-     * Overrides the "+ N more" text displayed when the total number of items exceeds `maxItems`
-     *
-     * @param {number} value The number of hidden items
-     * @returns {string} a replacement for the "+ N more" text
-     */
-    renderShowMore?: (value: number) => string;
-    /**
-     * Renders each item element. Designed to be used with [Tag](/components/tags).
-     *
-     * @param {Object} options Rendered item options
-     * @param {any} options.value The item value
-     * @param {Function} options.removeValue Remove item callback
-     * @returns {React.ReactElement} the item element
-     */
-    renderItem: (options: {
-        value: any;
-        removeValue: () => void;
-    }) => React.ReactElement;
-    /** Provides DOM access to the underlying input element */
-    inputRef?: React.Ref<HTMLInputElement>;
-    /** Defines the icon rendered before the element's content */
-    start?: any;
-}
+import React from 'react';
+import { IMultiselectProps } from '../../types';
 /**
  * @extends HTMLAttributes<HTMLDivElement>
  */

package/dist/typings/elements/Select/Select.d.ts

@@ -4,22 +4,8 @@
  * Use of this source code is governed under the Apache License, Version 2.0
  * found at http://www.apache.org/licenses/LICENSE-2.0.
  */
-import React, { HTMLAttributes } from 'react';
-import { VALIDATION } from '../../utils/validation';
-export interface ISelectProps extends HTMLAttributes<HTMLDivElement> {
-    /** Applies compact styling */
-    isCompact?: boolean;
-    /** Removes borders and padding */
-    isBare?: boolean;
-    /** Indicates that the element is not interactive */
-    disabled?: boolean;
-    /** Applies inset `box-shadow` styling on focus */
-    focusInset?: boolean;
-    /** Defines the element's validation state */
-    validation?: VALIDATION;
-    /** Defines the icon rendered before the element's content */
-    start?: any;
-}
+import React from 'react';
+import { ISelectProps } from '../../types';
 /**
  * @extends HTMLAttributes<HTMLDivElement>
  */

package/dist/typings/elements/Trigger/Trigger.d.ts

@@ -4,12 +4,8 @@
  * Use of this source code is governed under the Apache License, Version 2.0
  * found at http://www.apache.org/licenses/LICENSE-2.0.
  */
-import { HTMLAttributes } from 'react';
 import PropTypes from 'prop-types';
-export interface ITriggerProps extends HTMLAttributes<HTMLElement> {
-    /** Passes the ref callback to components with non-standard ref props (i.e. `innerRef`) */
-    refKey?: string;
-}
+import { ITriggerProps } from '../../types';
 /**
  * @extends HTMLAttributes<HTMLElement>
  */

package/dist/typings/index.d.ts

@@ -5,37 +5,27 @@
  * found at http://www.apache.org/licenses/LICENSE-2.0.
  */
 export { Dropdown } from './elements/Dropdown/Dropdown';
-export type { IDropdownProps } from './elements/Dropdown/Dropdown';
 export { Trigger } from './elements/Trigger/Trigger';
-export type { ITriggerProps } from './elements/Trigger/Trigger';
 export { Autocomplete } from './elements/Autocomplete/Autocomplete';
-export type { IAutocompleteProps } from './elements/Autocomplete/Autocomplete';
 export { Combobox } from './elements/Combobox/Combobox';
-export type { IComboboxProps } from './elements/Combobox/Combobox';
 export { Multiselect } from './elements/Multiselect/Multiselect';
-export type { IMultiselectProps } from './elements/Multiselect/Multiselect';
 export { Select } from './elements/Select/Select';
-export type { ISelectProps } from './elements/Select/Select';
 export { Field } from './elements/Fields/Field';
 export { Hint } from './elements/Fields/Hint';
 export { Label } from './elements/Fields/Label';
-export type { ILabelProps } from './elements/Fields/Label';
 export { Message } from './elements/Fields/Message';
-export type { IMessageProps } from './elements/Fields/Message';
 export { Menu } from './elements/Menu/Menu';
-export type { IMenuProps } from './elements/Menu/Menu';
 export { Separator } from './elements/Menu/Separator';
 export { AddItem } from './elements/Menu/Items/AddItem';
 export { HeaderIcon } from './elements/Menu/Items/HeaderIcon';
 export { HeaderItem } from './elements/Menu/Items/HeaderItem';
-export type { IHeaderItemProps } from './elements/Menu/Items/HeaderItem';
 export { Item } from './elements/Menu/Items/Item';
-export type { IItemProps } from './elements/Menu/Items/Item';
 export { ItemMeta } from './elements/Menu/Items/ItemMeta';
 export { MediaBody } from './elements/Menu/Items/MediaBody';
 export { MediaFigure } from './elements/Menu/Items/MediaFigure';
 export { MediaItem } from './elements/Menu/Items/MediaItem';
 export { NextItem } from './elements/Menu/Items/NextItem';
 export { PreviousItem } from './elements/Menu/Items/PreviousItem';
-export type { GARDEN_PLACEMENT, POPPER_PLACEMENT } from './utils/garden-placements';
+export type { IDropdownProps, ITriggerProps, ISelectProps, IAutocompleteProps, IComboboxProps, IMultiselectProps, IMenuProps, IItemProps, IHeaderItemProps, GardenPlacement as GARDEN_PLACEMENT, PopperPlacement as POPPER_PLACEMENT } from './types';
+export type { ILabelProps, IMessageProps } from '@zendeskgarden/react-forms';
 export { resetIdCounter } from 'downshift';

package/dist/typings/styled/menu/StyledMenu.d.ts

@@ -4,12 +4,12 @@
  * Use of this source code is governed under the Apache License, Version 2.0
  * found at http://www.apache.org/licenses/LICENSE-2.0.
  */
-import { POPPER_PLACEMENT } from '../../utils/garden-placements';
+import { PopperPlacement } from '../../types';
 interface IStyledMenuProps {
     isCompact?: boolean;
     isAnimated?: boolean;
     hasArrow?: boolean;
-    placement?: POPPER_PLACEMENT;
+    placement?: PopperPlacement;
     maxHeight?: string;
 }
 /**

package/dist/typings/styled/menu/StyledMenuWrapper.d.ts

@@ -4,10 +4,10 @@
  * Use of this source code is governed under the Apache License, Version 2.0
  * found at http://www.apache.org/licenses/LICENSE-2.0.
  */
-import { POPPER_PLACEMENT } from '../../utils/garden-placements';
+import { PopperPlacement } from '../../types';
 interface IStyledMenuWrapperProps {
     hasArrow?: boolean;
-    placement?: POPPER_PLACEMENT;
+    placement?: PopperPlacement;
     isHidden?: boolean;
     zIndex?: number;
     isAnimated?: boolean;

package/dist/typings/styled/select/StyledFauxInput.d.ts

@@ -7,7 +7,7 @@
 /// <reference types="react" />
 export declare const StyledFauxInput: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@zendeskgarden/react-forms").IFauxInputProps & import("react").RefAttributes<HTMLDivElement>> & {
     EndIcon: {
-        (props: import("@zendeskgarden/react-forms").IFauxInputEndIconProps): JSX.Element;
+        (props: import("@zendeskgarden/react-forms").IFauxInputStartIconProps): JSX.Element;
         displayName: string;
     };
     StartIcon: {

package/dist/typings/types/index.d.ts

@@ -0,0 +1,146 @@
+/**
+ * Copyright Zendesk, Inc.
+ *
+ * Use of this source code is governed under the Apache License, Version 2.0
+ * found at http://www.apache.org/licenses/LICENSE-2.0.
+ */
+import { HTMLAttributes, LiHTMLAttributes } from 'react';
+import { ControllerStateAndHelpers, StateChangeOptions } from 'downshift';
+import { Modifiers } from 'popper.js';
+import { IFauxInputProps } from '@zendeskgarden/react-forms';
+export declare const PLACEMENT: readonly ["auto", "top", "top-start", "top-end", "bottom", "bottom-start", "bottom-end", "end", "end-top", "end-bottom", "start", "start-top", "start-bottom"];
+export declare const POPPER_PLACEMENT: readonly ["auto", "top", "top-start", "top-end", "bottom", "bottom-start", "bottom-end", "right", "right-start", "right-end", "left", "left-start", "left-end"];
+export declare type GardenPlacement = typeof PLACEMENT[number];
+export declare type PopperPlacement = typeof POPPER_PLACEMENT[number];
+export interface IDropdownProps {
+    /** Opens the dropdown */
+    isOpen?: boolean;
+    /** Identifies the currently selected item */
+    selectedItem?: any;
+    /** Identifies the currently selected items */
+    selectedItems?: any[];
+    /** Highlights an element at a selected index */
+    highlightedIndex?: number;
+    /** Sets the value of the input element*/
+    inputValue?: string;
+    /**
+     * Handles item selection
+     *
+     * @param {any|null} selectedItem The selected item
+     * @param {Object} stateAndHelpers [Downshift state and helpers](https://github.com/downshift-js/downshift#onselect)
+     * */
+    onSelect?: (selectedItem: any | null, stateAndHelpers: ControllerStateAndHelpers<any>) => void;
+    /**
+     * Handles state change
+     *
+     * @param {Object} options [Downshift internal state changes](https://github.com/downshift-js/downshift#onstatechange)
+     * @param {Object} stateAndHelpers [Downshift state and helpers](https://github.com/downshift-js/downshift#onstatechange)
+     * */
+    onStateChange?: (options: StateChangeOptions<any>, stateAndHelpers: ControllerStateAndHelpers<any>) => void;
+    /**
+     * Handles input value change
+     *
+     * @param {string} inputValue Value of the input element
+     * @param {Object} stateAndHelpers [Downshift state and helpers](https://github.com/downshift-js/downshift#oninputvaluechange)
+     * */
+    onInputValueChange?: (inputValue: string, stateAndHelpers: ControllerStateAndHelpers<any>) => void;
+    /** Passes customization props to the [Downshift](https://www.downshift-js.com/) component */
+    downshiftProps?: Record<string, any>;
+}
+export interface ITriggerProps extends HTMLAttributes<HTMLElement> {
+    /** Passes the ref callback to components with non-standard ref props (i.e. `innerRef`) */
+    refKey?: string;
+}
+export interface ISelectProps extends Omit<IFauxInputProps, 'isFocused' | 'isHovered' | 'readOnly'> {
+    /** Defines the icon rendered before the element's content */
+    start?: any;
+}
+export interface IAutocompleteProps extends ISelectProps {
+    /** Provides ref access to the underlying input element */
+    inputRef?: React.Ref<HTMLInputElement>;
+}
+export interface IComboboxProps extends IAutocompleteProps {
+    /** Defines text that appears in the element when no items are selected */
+    placeholder?: string;
+    /** Defines the icon rendered in the end position */
+    end?: any;
+}
+export interface IMultiselectProps extends IAutocompleteProps {
+    /** Defines text that appears in the element when no items are selected */
+    placeholder?: string;
+    /** Determines the maximum number of items displayed while collapsed */
+    maxItems?: number;
+    /**
+     * Overrides the "+ N more" text displayed when the total number of items exceeds `maxItems`
+     *
+     * @param {number} value The number of hidden items
+     * @returns {string} a replacement for the "+ N more" text
+     */
+    renderShowMore?: (value: number) => string;
+    /**
+     * Renders each item element. Designed to be used with [Tag](/components/tags).
+     *
+     * @param {Object} options Rendered item options
+     * @param {any} options.value The item value
+     * @param {Function} options.removeValue Remove item callback
+     * @returns {React.ReactElement} the item element
+     */
+    renderItem: (options: {
+        value: any;
+        removeValue: () => void;
+    }) => React.ReactElement;
+}
+export interface IMenuProps extends HTMLAttributes<HTMLUListElement> {
+    /**
+     * Passes configuration options to the [Popper instance](https://popper.js.org/docs/v2/modifiers/)
+     */
+    popperModifiers?: Modifiers;
+    /**
+     * Allows the menu to reposition during browser resize events
+     */
+    eventsEnabled?: boolean;
+    /**
+     * Sets the `z-index` of the menu
+     */
+    zIndex?: number;
+    /**
+     * Adjusts the placement of the menu
+     */
+    placement?: GardenPlacement;
+    /**
+     * Animates the menu
+     */
+    isAnimated?: boolean;
+    /**
+     * Applies compact styling
+     */
+    isCompact?: boolean;
+    /**
+     * Attaches an arrow that points towards the menu trigger
+     */
+    hasArrow?: boolean;
+    /**
+     * Sets the `max-height` of the menu
+     */
+    maxHeight?: string;
+    /**
+     * Appends the menu to the element provided
+     */
+    appendToNode?: HTMLElement;
+}
+export interface IItemProps extends LiHTMLAttributes<HTMLLIElement> {
+    /** Sets the value that is returned upon selection */
+    value?: any;
+    /** Indicates that the element is not interactive */
+    disabled?: boolean;
+    /** Applies danger styling */
+    isDanger?: boolean;
+    /**
+     * @ignore Sets the wrapping component for the item
+     */
+    component?: any;
+}
+export interface IHeaderItemProps extends LiHTMLAttributes<HTMLLIElement> {
+    /** Applies icon styling */
+    hasIcon?: boolean;
+}

package/dist/typings/utils/garden-placements.d.ts

@@ -4,27 +4,23 @@
  * Use of this source code is governed under the Apache License, Version 2.0
  * found at http://www.apache.org/licenses/LICENSE-2.0.
  */
-import { ARROW_POSITION, MENU_POSITION } from '@zendeskgarden/react-theming';
-declare type SHARED_PLACEMENT = 'auto' | 'top' | 'top-start' | 'top-end' | 'bottom' | 'bottom-start' | 'bottom-end';
-export declare type GARDEN_PLACEMENT = SHARED_PLACEMENT | 'end' | 'end-top' | 'end-bottom' | 'start' | 'start-top' | 'start-bottom';
-export declare type POPPER_PLACEMENT = SHARED_PLACEMENT | 'right' | 'right-start' | 'right-end' | 'left' | 'left-start' | 'left-end';
+import { GardenPlacement, PopperPlacement } from '../types';
 /**
  * Convert Garden RTL aware placement to Popper.JS valid placement
  */
-export declare function getPopperPlacement(gardenPlacement: GARDEN_PLACEMENT): POPPER_PLACEMENT;
+export declare function getPopperPlacement(gardenPlacement: GardenPlacement): PopperPlacement;
 /**
  * Convert Garden RTL aware placement to RTL equivalent Popper.JS placement
  * @param {String} gardenPlacement
  */
-export declare function getRtlPopperPlacement(gardenPlacement: GARDEN_PLACEMENT): POPPER_PLACEMENT;
+export declare function getRtlPopperPlacement(gardenPlacement: GardenPlacement): PopperPlacement;
 /**
  * Convert Popper.JS placement to corresponding arrow position
  * @param {String} popperPlacement
  */
-export declare function getArrowPosition(popperPlacement?: POPPER_PLACEMENT): ARROW_POSITION;
+export declare function getArrowPosition(popperPlacement?: PopperPlacement): "top" | "bottom" | "right" | "left" | "top-left" | "top-right" | "right-top" | "right-bottom" | "bottom-left" | "bottom-right" | "left-top" | "left-bottom";
 /**
  * Convert Popper.JS placement to corresponding menu position
  * @param {String} popperPlacement
  */
-export declare function getMenuPosition(popperPlacement?: POPPER_PLACEMENT): MENU_POSITION;
-export {};
+export declare function getMenuPosition(popperPlacement?: PopperPlacement): "top" | "bottom" | "right" | "left";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zendeskgarden/react-dropdowns",
-  "version": "8.49.2",
+  "version": "8.50.0",
   "description": "Components relating to dropdowns in the Garden Design System",
   "license": "Apache-2.0",
   "author": "Zendesk Garden <garden@zendesk.com>",
@@ -23,7 +23,7 @@
   "dependencies": {
     "@zendeskgarden/container-selection": "^1.3.8",
     "@zendeskgarden/container-utilities": "^0.7.0",
-    "@zendeskgarden/react-forms": "^8.49.2",
+    "@zendeskgarden/react-forms": "^8.50.0",
     "downshift": "^6.0.0",
     "polished": "^4.0.0",
     "prop-types": "^15.5.7",
@@ -38,8 +38,8 @@
   },
   "devDependencies": {
     "@types/lodash.debounce": "4.0.6",
-    "@zendeskgarden/react-theming": "^8.49.2",
-    "@zendeskgarden/svg-icons": "6.30.2",
+    "@zendeskgarden/react-theming": "^8.50.0",
+    "@zendeskgarden/svg-icons": "6.31.1",
     "lodash.debounce": "4.0.8"
   },
   "keywords": [
@@ -52,5 +52,5 @@
     "access": "public"
   },
   "zendeskgarden:src": "src/index.ts",
-  "gitHead": "fd7769285a2f4bc1169c63f4db57a85a6e793027"
+  "gitHead": "d5b66e1980faf0fd40818c9e74801dfa1c3550a0"
 }

package/dist/typings/utils/validation.d.ts

@@ -1,7 +0,0 @@
-/**
- * Copyright Zendesk, Inc.
- *
- * Use of this source code is governed under the Apache License, Version 2.0
- * found at http://www.apache.org/licenses/LICENSE-2.0.
- */
-export declare type VALIDATION = 'success' | 'warning' | 'error';