@zendeskgarden/react-dropdowns 9.0.0-next.9 → 9.0.0

package/dist/esm/elements/combobox/Combobox.js

@@ -43,7 +43,6 @@ import '../../views/menu/StyledItemGroup.js';
 import '../../views/menu/StyledItemIcon.js';
 import '../../views/menu/StyledItemMeta.js';
 import '../../views/menu/StyledItemTypeIcon.js';
-import '../../views/menu/StyledButton.js';
 import '../../views/menu/StyledSeparator.js';
 import { Listbox } from './Listbox.js';
 import { TagGroup } from './TagGroup.js';
@@ -243,10 +242,10 @@ const Combobox = forwardRef((_ref, ref) => {
     tabIndex: -1
   }, props, {
     ref: ref
-  }), React__default.createElement(StyledTrigger, triggerProps, React__default.createElement(StyledContainer, null, startIcon && React__default.createElement(StyledInputIcon, {
+  }), React__default.createElement(StyledTrigger, triggerProps, React__default.createElement(StyledContainer, null, !!startIcon && React__default.createElement(StyledInputIcon, {
     $isLabelHovered: isLabelHovered,
     $isCompact: isCompact
-  }, startIcon), React__default.createElement(StyledInputGroup, null, isMultiselectable && Array.isArray(selection) && React__default.createElement(TagGroup, {
+  }, startIcon), React__default.createElement(StyledInputGroup, null, !!isMultiselectable && Array.isArray(selection) && React__default.createElement(TagGroup, {
     isDisabled: isDisabled,
     isExpanded: isTagGroupExpanded,
     maxTags: maxTags,
@@ -273,11 +272,11 @@ const Combobox = forwardRef((_ref, ref) => {
   }, renderValue ? renderValue({
     selection,
     inputValue
-  }) : inputValue || placeholder), React__default.createElement(StyledInput, inputProps)), (hasChevron || endIcon) && React__default.createElement(StyledInputIcon, {
+  }) : inputValue || placeholder), React__default.createElement(StyledInput, inputProps)), !!(hasChevron || endIcon) && React__default.createElement(StyledInputIcon, {
     $isCompact: isCompact,
     $isEnd: true,
     $isLabelHovered: isLabelHovered,
-    $isRotated: hasChevron && isExpanded
+    $isRotated: !!(hasChevron && isExpanded)
   }, hasChevron ? React__default.createElement(SvgChevronDownStroke, null) : endIcon))), React__default.createElement(Listbox, Object.assign({
     appendToNode: listboxAppendToNode,
     isCompact: isCompact,

package/dist/esm/elements/combobox/Field.js

@@ -36,7 +36,6 @@ import '../../views/menu/StyledItemGroup.js';
 import '../../views/menu/StyledItemIcon.js';
 import '../../views/menu/StyledItemMeta.js';
 import '../../views/menu/StyledItemTypeIcon.js';
-import '../../views/menu/StyledButton.js';
 import '../../views/menu/StyledSeparator.js';
 import { Hint } from './Hint.js';
 import { Label } from './Label.js';

package/dist/esm/elements/combobox/Hint.js

@@ -36,7 +36,6 @@ import '../../views/menu/StyledItemGroup.js';
 import '../../views/menu/StyledItemIcon.js';
 import '../../views/menu/StyledItemMeta.js';
 import '../../views/menu/StyledItemTypeIcon.js';
-import '../../views/menu/StyledButton.js';
 import '../../views/menu/StyledSeparator.js';
 
 const Hint = forwardRef((props, ref) => {
@@ -52,6 +51,6 @@ const Hint = forwardRef((props, ref) => {
     ref: ref
   }));
 });
-Hint.displayName = 'Hint';
+Hint.displayName = 'Field.Hint';
 
 export { Hint };

package/dist/esm/elements/combobox/Label.js

@@ -38,7 +38,6 @@ import '../../views/menu/StyledItemGroup.js';
 import '../../views/menu/StyledItemIcon.js';
 import '../../views/menu/StyledItemMeta.js';
 import '../../views/menu/StyledItemTypeIcon.js';
-import '../../views/menu/StyledButton.js';
 import '../../views/menu/StyledSeparator.js';
 
 const Label = forwardRef((_ref, ref) => {
@@ -59,7 +58,7 @@ const Label = forwardRef((_ref, ref) => {
     ref: ref
   }));
 });
-Label.displayName = 'Label';
+Label.displayName = 'Field.Label';
 Label.propTypes = {
   hidden: PropTypes.bool,
   isRegular: PropTypes.bool

package/dist/esm/elements/combobox/Listbox.js

@@ -38,7 +38,6 @@ import '../../views/menu/StyledItemGroup.js';
 import '../../views/menu/StyledItemIcon.js';
 import '../../views/menu/StyledItemMeta.js';
 import '../../views/menu/StyledItemTypeIcon.js';
-import '../../views/menu/StyledButton.js';
 import '../../views/menu/StyledSeparator.js';
 import { ThemeContext } from 'styled-components';
 import { DEFAULT_THEME } from '@zendeskgarden/react-theming';
@@ -139,7 +138,7 @@ const Listbox = forwardRef((_ref, ref) => {
     }
   }, props, {
     ref: ref
-  }), isVisible && children));
+  }), !!isVisible && children));
   return appendToNode ? createPortal(Node, appendToNode) : Node;
 });
 Listbox.displayName = 'Listbox';

package/dist/esm/elements/combobox/Message.js

@@ -38,7 +38,6 @@ import '../../views/menu/StyledItemGroup.js';
 import '../../views/menu/StyledItemIcon.js';
 import '../../views/menu/StyledItemMeta.js';
 import '../../views/menu/StyledItemTypeIcon.js';
-import '../../views/menu/StyledButton.js';
 import '../../views/menu/StyledSeparator.js';
 
 const Message = forwardRef((props, ref) => {
@@ -54,7 +53,7 @@ const Message = forwardRef((props, ref) => {
     ref: ref
   }));
 });
-Message.displayName = 'Message';
+Message.displayName = 'Field.Message';
 Message.propTypes = {
   validation: PropTypes.oneOf(VALIDATION),
   validationLabel: PropTypes.string

package/dist/esm/elements/combobox/OptGroup.js

@@ -39,7 +39,6 @@ import '../../views/menu/StyledItemGroup.js';
 import '../../views/menu/StyledItemIcon.js';
 import '../../views/menu/StyledItemMeta.js';
 import '../../views/menu/StyledItemTypeIcon.js';
-import '../../views/menu/StyledButton.js';
 import '../../views/menu/StyledSeparator.js';
 
 const OptGroup = forwardRef((_ref, ref) => {
@@ -70,11 +69,11 @@ const OptGroup = forwardRef((_ref, ref) => {
     role: "none"
   }, props, {
     ref: ref
-  }), React__default.createElement(StyledOptionContent, null, (content || legend) && React__default.createElement(StyledOption, {
+  }), React__default.createElement(StyledOptionContent, null, !!(content || legend) && React__default.createElement(StyledOption, {
     as: "div",
     isCompact: isCompact,
     $type: "header"
-  }, icon && React__default.createElement(StyledOptionTypeIcon, {
+  }, !!icon && React__default.createElement(StyledOptionTypeIcon, {
     $isCompact: isCompact,
     $type: "header"
   }, icon), content || legend), React__default.createElement(StyledOptGroup, Object.assign({

package/dist/esm/elements/combobox/Option.js

@@ -44,7 +44,6 @@ import '../../views/menu/StyledItemGroup.js';
 import '../../views/menu/StyledItemIcon.js';
 import '../../views/menu/StyledItemMeta.js';
 import '../../views/menu/StyledItemTypeIcon.js';
-import '../../views/menu/StyledButton.js';
 import '../../views/menu/StyledSeparator.js';
 import { OptionMeta } from './OptionMeta.js';
 import { toOption } from './utils.js';
@@ -62,8 +61,9 @@ const OptionComponent = forwardRef((_ref, ref) => {
     ...props
   } = _ref;
   const contextValue = useMemo(() => ({
-    isDisabled
-  }), [isDisabled]);
+    isDisabled,
+    type
+  }), [isDisabled, type]);
   const {
     activeValue,
     getOptionProps,
@@ -114,7 +114,10 @@ const OptionComponent = forwardRef((_ref, ref) => {
   }, props, optionProps), React__default.createElement(StyledOptionTypeIcon, {
     $isCompact: isCompact,
     $type: type
-  }, renderActionIcon(type)), icon && React__default.createElement(StyledOptionIcon, null, icon), React__default.createElement(StyledOptionContent, null, children || label || value)));
+  }, renderActionIcon(type)), !!icon && React__default.createElement(StyledOptionIcon, {
+    $isDisabled: isDisabled,
+    $type: type
+  }, icon), React__default.createElement(StyledOptionContent, null, children || label || value)));
 });
 OptionComponent.displayName = 'Option';
 OptionComponent.propTypes = {

package/dist/esm/elements/combobox/OptionMeta.js

@@ -36,7 +36,6 @@ import '../../views/menu/StyledItemGroup.js';
 import '../../views/menu/StyledItemIcon.js';
 import '../../views/menu/StyledItemMeta.js';
 import '../../views/menu/StyledItemTypeIcon.js';
-import '../../views/menu/StyledButton.js';
 import '../../views/menu/StyledSeparator.js';
 
 const OptionMetaComponent = forwardRef((props, ref) => {

package/dist/esm/elements/combobox/Tag.js

@@ -40,7 +40,6 @@ import '../../views/menu/StyledItemGroup.js';
 import '../../views/menu/StyledItemIcon.js';
 import '../../views/menu/StyledItemMeta.js';
 import '../../views/menu/StyledItemTypeIcon.js';
-import '../../views/menu/StyledButton.js';
 import '../../views/menu/StyledSeparator.js';
 import { TagAvatar } from './TagAvatar.js';
 

package/dist/esm/elements/menu/Item.js

@@ -42,7 +42,6 @@ import '../../views/menu/StyledItemGroup.js';
 import { StyledItemIcon } from '../../views/menu/StyledItemIcon.js';
 import '../../views/menu/StyledItemMeta.js';
 import { StyledItemTypeIcon } from '../../views/menu/StyledItemTypeIcon.js';
-import '../../views/menu/StyledButton.js';
 import '../../views/menu/StyledSeparator.js';
 import { ItemMeta } from './ItemMeta.js';
 import useMenuContext from '../../context/useMenuContext.js';
@@ -70,7 +69,8 @@ const ItemComponent = forwardRef((_ref, ref) => {
   } = useItemGroupContext();
   const {
     focusedValue,
-    getItemProps
+    getItemProps,
+    isCompact
   } = useMenuContext();
   const item = {
     ...toItem({
@@ -93,9 +93,6 @@ const ItemComponent = forwardRef((_ref, ref) => {
     onMouseEnter
   });
   const isActive = value === focusedValue;
-  const {
-    isCompact
-  } = useMenuContext();
   const renderActionIcon = iconType => {
     switch (iconType) {
       case 'add':
@@ -109,8 +106,9 @@ const ItemComponent = forwardRef((_ref, ref) => {
     }
   };
   const contextValue = useMemo(() => ({
-    isDisabled
-  }), [isDisabled]);
+    isDisabled,
+    type
+  }), [isDisabled, type]);
   return React__default.createElement(ItemContext.Provider, {
     value: contextValue
   }, React__default.createElement(StyledItem, Object.assign({
@@ -122,7 +120,10 @@ const ItemComponent = forwardRef((_ref, ref) => {
   }), React__default.createElement(StyledItemTypeIcon, {
     $isCompact: isCompact,
     $type: type
-  }, renderActionIcon(type)), icon && React__default.createElement(StyledItemIcon, null, icon), React__default.createElement(StyledItemContent, null, children || label)));
+  }, renderActionIcon(type)), !!icon && React__default.createElement(StyledItemIcon, {
+    $isDisabled: isDisabled,
+    $type: type
+  }, icon), React__default.createElement(StyledItemContent, null, children || label)));
 });
 ItemComponent.displayName = 'Item';
 ItemComponent.propTypes = {

package/dist/esm/elements/menu/ItemGroup.js

@@ -38,7 +38,6 @@ import { StyledItemGroup } from '../../views/menu/StyledItemGroup.js';
 import '../../views/menu/StyledItemIcon.js';
 import '../../views/menu/StyledItemMeta.js';
 import { StyledItemTypeIcon } from '../../views/menu/StyledItemTypeIcon.js';
-import '../../views/menu/StyledButton.js';
 import { StyledSeparator } from '../../views/menu/StyledSeparator.js';
 import { ItemGroupContext } from '../../context/useItemGroupContext.js';
 
@@ -71,12 +70,13 @@ const ItemGroup = forwardRef((_ref, ref) => {
     isCompact: isCompact,
     $type: "group"
   }, props, {
+    role: "none",
     ref: ref
-  }), React__default.createElement(StyledItemContent, null, (content || legend) && React__default.createElement(StyledItem, {
+  }), React__default.createElement(StyledItemContent, null, !!(content || legend) && React__default.createElement(StyledItem, {
     as: "div",
     isCompact: isCompact,
     $type: "header"
-  }, icon && React__default.createElement(StyledItemTypeIcon, {
+  }, !!icon && React__default.createElement(StyledItemTypeIcon, {
     $isCompact: isCompact,
     $type: "header"
   }, icon), content || legend), React__default.createElement(StyledItemGroup, Object.assign({

package/dist/esm/elements/menu/ItemMeta.js

@@ -36,7 +36,6 @@ import '../../views/menu/StyledItemGroup.js';
 import '../../views/menu/StyledItemIcon.js';
 import { StyledItemMeta } from '../../views/menu/StyledItemMeta.js';
 import '../../views/menu/StyledItemTypeIcon.js';
-import '../../views/menu/StyledButton.js';
 import '../../views/menu/StyledSeparator.js';
 
 const ItemMetaComponent = forwardRef((props, ref) => {

package/dist/esm/elements/menu/Menu.js

@@ -10,45 +10,14 @@ import { mergeRefs } from 'react-merge-refs';
 import { ThemeContext } from 'styled-components';
 import { useMenu } from '@zendeskgarden/container-menu';
 import { DEFAULT_THEME, useWindow } from '@zendeskgarden/react-theming';
+import { Button } from '@zendeskgarden/react-buttons';
 import { PLACEMENT } from '../../types/index.js';
 import { MenuContext } from '../../context/useMenuContext.js';
 import { toItems } from './utils.js';
 import { MenuList } from './MenuList.js';
-import '../../views/combobox/StyledCombobox.js';
-import '../../views/combobox/StyledContainer.js';
-import '../../views/combobox/StyledField.js';
-import '../../views/combobox/StyledFloatingListbox.js';
-import '../../views/combobox/StyledHint.js';
-import '../../views/combobox/StyledInput.js';
-import '../../views/combobox/StyledInputGroup.js';
-import '../../views/combobox/StyledInputIcon.js';
-import '../../views/combobox/StyledLabel.js';
-import '../../views/combobox/StyledListbox.js';
-import '../../views/combobox/StyledListboxSeparator.js';
-import '../../views/combobox/StyledMessage.js';
-import '../../views/combobox/StyledOptGroup.js';
-import '../../views/combobox/StyledOption.js';
-import '../../views/combobox/StyledOptionContent.js';
-import '../../views/combobox/StyledOptionIcon.js';
-import '../../views/combobox/StyledOptionMeta.js';
-import '../../views/combobox/StyledOptionTypeIcon.js';
-import '../../views/combobox/StyledTag.js';
-import '../../views/combobox/StyledTagsButton.js';
-import '../../views/combobox/StyledTrigger.js';
-import '../../views/combobox/StyledValue.js';
-import '../../views/menu/StyledMenu.js';
-import '../../views/menu/StyledFloatingMenu.js';
-import '../../views/menu/StyledItem.js';
-import '../../views/menu/StyledItemContent.js';
-import '../../views/menu/StyledItemGroup.js';
-import '../../views/menu/StyledItemIcon.js';
-import '../../views/menu/StyledItemMeta.js';
-import '../../views/menu/StyledItemTypeIcon.js';
-import { StyledButton } from '../../views/menu/StyledButton.js';
-import '../../views/menu/StyledSeparator.js';
 import SvgChevronDownStroke from '../../node_modules/@zendeskgarden/svg-icons/src/16/chevron-down-stroke.svg.js';
 
-const Menu = forwardRef((_ref, ref) => {
+const Menu = forwardRef((_ref2, ref) => {
   let {
     button,
     buttonProps: _buttonProps = {},
@@ -58,11 +27,12 @@ const Menu = forwardRef((_ref, ref) => {
     defaultFocusedValue,
     defaultExpanded,
     isExpanded: _isExpanded,
+    restoreFocus,
     selectedItems,
     onChange,
     onMouseLeave,
     ...props
-  } = _ref;
+  } = _ref2;
   const triggerRef = useRef(null);
   const menuRef = useRef(null);
   const items = toItems(children);
@@ -83,6 +53,7 @@ const Menu = forwardRef((_ref, ref) => {
     focusedValue: _focusedValue,
     defaultExpanded,
     isExpanded: _isExpanded,
+    restoreFocus,
     selectedItems,
     items,
     menuRef,
@@ -93,6 +64,7 @@ const Menu = forwardRef((_ref, ref) => {
     onClick,
     onKeyDown,
     disabled,
+    ref: _ref,
     ...buttonProps
   } = _buttonProps;
   const triggerProps = {
@@ -106,9 +78,9 @@ const Menu = forwardRef((_ref, ref) => {
       onKeyDown,
       disabled
     }),
-    ref: mergeRefs([triggerRef, ref])
+    ref: mergeRefs([triggerRef, _ref])
   };
-  const trigger = typeof button === 'function' ? button(triggerProps) : React__default.createElement(StyledButton, triggerProps, button, React__default.createElement(StyledButton.EndIcon, {
+  const trigger = typeof button === 'function' ? button(triggerProps) : React__default.createElement(Button, triggerProps, button, React__default.createElement(Button.EndIcon, {
     isRotated: isExpanded
   }, React__default.createElement(SvgChevronDownStroke, null)));
   const contextValue = useMemo(() => ({
@@ -145,6 +117,7 @@ Menu.propTypes = {
   minHeight: PropTypes.string,
   onChange: PropTypes.func,
   placement: PropTypes.oneOf(PLACEMENT),
+  restoreFocus: PropTypes.bool,
   selectedItems: PropTypes.arrayOf(PropTypes.any),
   zIndex: PropTypes.number
 };

package/dist/esm/elements/menu/MenuList.js

@@ -40,7 +40,6 @@ import '../../views/menu/StyledItemGroup.js';
 import '../../views/menu/StyledItemIcon.js';
 import '../../views/menu/StyledItemMeta.js';
 import '../../views/menu/StyledItemTypeIcon.js';
-import '../../views/menu/StyledButton.js';
 import '../../views/menu/StyledSeparator.js';
 import { createPortal } from 'react-dom';
 
@@ -128,7 +127,7 @@ const MenuList = forwardRef((_ref, ref) => {
   children, update]);
   const Node = React__default.createElement(StyledFloatingMenu, {
     "data-garden-animate": isVisible,
-    isHidden: !isExpanded,
+    isHidden: !isExpanded || !isVisible ,
     position: getMenuPosition(placement),
     zIndex: zIndex,
     style: {
@@ -146,7 +145,7 @@ const MenuList = forwardRef((_ref, ref) => {
     }
   }, props, {
     ref: ref
-  }), isVisible && children));
+  }), !!isVisible && children));
   return appendToNode ? createPortal(Node, appendToNode) : Node;
 });
 MenuList.displayName = 'MenuList';

package/dist/esm/elements/menu/Separator.js

@@ -35,7 +35,6 @@ import '../../views/menu/StyledItemGroup.js';
 import '../../views/menu/StyledItemIcon.js';
 import '../../views/menu/StyledItemMeta.js';
 import '../../views/menu/StyledItemTypeIcon.js';
-import '../../views/menu/StyledButton.js';
 import { StyledSeparator } from '../../views/menu/StyledSeparator.js';
 import useMenuContext from '../../context/useMenuContext.js';
 

package/dist/esm/node_modules/@zendeskgarden/svg-icons/src/16/check-lg-stroke.svg.js

@@ -7,7 +7,7 @@
 import * as React from 'react';
 
 var _path;
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
 var SvgCheckLgStroke = function SvgCheckLgStroke(props) {
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",

package/dist/esm/node_modules/@zendeskgarden/svg-icons/src/16/chevron-down-stroke.svg.js

@@ -7,7 +7,7 @@
 import * as React from 'react';
 
 var _path;
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
 var SvgChevronDownStroke = function SvgChevronDownStroke(props) {
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",

package/dist/esm/node_modules/@zendeskgarden/svg-icons/src/16/chevron-left-stroke.svg.js

@@ -7,7 +7,7 @@
 import * as React from 'react';
 
 var _path;
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
 var SvgChevronLeftStroke = function SvgChevronLeftStroke(props) {
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",

package/dist/esm/node_modules/@zendeskgarden/svg-icons/src/16/chevron-right-stroke.svg.js

@@ -7,7 +7,7 @@
 import * as React from 'react';
 
 var _path;
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
 var SvgChevronRightStroke = function SvgChevronRightStroke(props) {
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",

package/dist/esm/node_modules/@zendeskgarden/svg-icons/src/16/plus-stroke.svg.js

@@ -7,7 +7,7 @@
 import * as React from 'react';
 
 var _path;
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
 var SvgPlusStroke = function SvgPlusStroke(props) {
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",

package/dist/esm/views/combobox/StyledCombobox.js

@@ -5,7 +5,7 @@
 * found at http://www.apache.org/licenses/LICENSE-2.0.
 */
 import styled, { css } from 'styled-components';
-import { retrieveComponentStyles, DEFAULT_THEME } from '@zendeskgarden/react-theming';
+import { retrieveComponentStyles } from '@zendeskgarden/react-theming';
 import { StyledLabel } from './StyledLabel.js';
 import { StyledHint } from './StyledHint.js';
 import { StyledMessage } from './StyledMessage.js';
@@ -18,13 +18,10 @@ const sizeStyles = props => {
 };
 const StyledCombobox = styled.div.attrs({
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.0.0-next.9'
+  'data-garden-version': '9.0.0'
 }).withConfig({
   displayName: "StyledCombobox",
   componentId: "sc-13eybg8-0"
 })(["", ";", ";"], sizeStyles, props => retrieveComponentStyles(COMPONENT_ID, props));
-StyledCombobox.defaultProps = {
-  theme: DEFAULT_THEME
-};
 
 export { StyledCombobox };

package/dist/esm/views/combobox/StyledContainer.js

@@ -5,18 +5,15 @@
 * found at http://www.apache.org/licenses/LICENSE-2.0.
 */
 import styled from 'styled-components';
-import { retrieveComponentStyles, DEFAULT_THEME } from '@zendeskgarden/react-theming';
+import { retrieveComponentStyles } from '@zendeskgarden/react-theming';
 
 const COMPONENT_ID = 'dropdowns.combobox.container';
 const StyledContainer = styled.div.attrs({
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.0.0-next.9'
+  'data-garden-version': '9.0.0'
 }).withConfig({
   displayName: "StyledContainer",
   componentId: "sc-14i9jid-0"
 })(["display:flex;", ";"], props => retrieveComponentStyles(COMPONENT_ID, props));
-StyledContainer.defaultProps = {
-  theme: DEFAULT_THEME
-};
 
 export { StyledContainer };

package/dist/esm/views/combobox/StyledField.js

@@ -5,18 +5,15 @@
 * found at http://www.apache.org/licenses/LICENSE-2.0.
 */
 import styled from 'styled-components';
-import { retrieveComponentStyles, DEFAULT_THEME } from '@zendeskgarden/react-theming';
+import { retrieveComponentStyles } from '@zendeskgarden/react-theming';
 
 const COMPONENT_ID = 'dropdowns.combobox.field';
 const StyledField = styled.div.attrs({
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.0.0-next.9'
+  'data-garden-version': '9.0.0'
 }).withConfig({
   displayName: "StyledField",
   componentId: "sc-zc57xl-0"
 })(["direction:", ";", ";"], props => props.theme.rtl ? 'rtl' : 'ltr', props => retrieveComponentStyles(COMPONENT_ID, props));
-StyledField.defaultProps = {
-  theme: DEFAULT_THEME
-};
 
 export { StyledField };

package/dist/esm/views/combobox/StyledFloatingListbox.js

@@ -5,12 +5,12 @@
 * found at http://www.apache.org/licenses/LICENSE-2.0.
 */
 import styled from 'styled-components';
-import { menuStyles, retrieveComponentStyles, DEFAULT_THEME } from '@zendeskgarden/react-theming';
+import { menuStyles, retrieveComponentStyles } from '@zendeskgarden/react-theming';
 
 const COMPONENT_ID = 'dropdowns.combobox.floating';
 const StyledFloatingListbox = styled.div.attrs({
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.0.0-next.9'
+  'data-garden-version': '9.0.0'
 }).withConfig({
   displayName: "StyledFloatingListbox",
   componentId: "sc-1cp6spf-0"
@@ -20,8 +20,5 @@ const StyledFloatingListbox = styled.div.attrs({
   animationModifier: '[data-garden-animate="true"]',
   zIndex: props.zIndex
 }), props => retrieveComponentStyles(COMPONENT_ID, props));
-StyledFloatingListbox.defaultProps = {
-  theme: DEFAULT_THEME
-};
 
 export { StyledFloatingListbox };

package/dist/esm/views/combobox/StyledHint.js

@@ -5,19 +5,16 @@
 * found at http://www.apache.org/licenses/LICENSE-2.0.
 */
 import styled from 'styled-components';
-import { retrieveComponentStyles, DEFAULT_THEME } from '@zendeskgarden/react-theming';
+import { retrieveComponentStyles } from '@zendeskgarden/react-theming';
 import { Field } from '@zendeskgarden/react-forms';
 
 const COMPONENT_ID = 'dropdowns.combobox.hint';
 const StyledHint = styled(Field.Hint).attrs({
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.0.0-next.9'
+  'data-garden-version': '9.0.0'
 }).withConfig({
   displayName: "StyledHint",
   componentId: "sc-106qvqx-0"
 })(["", ";"], props => retrieveComponentStyles(COMPONENT_ID, props));
-StyledHint.defaultProps = {
-  theme: DEFAULT_THEME
-};
 
 export { StyledHint };

package/dist/esm/views/combobox/StyledInput.js

@@ -6,11 +6,17 @@
 */
 import styled, { css } from 'styled-components';
 import { hideVisually, math } from 'polished';
-import { retrieveComponentStyles, DEFAULT_THEME, getColorV8, getLineHeight } from '@zendeskgarden/react-theming';
+import { retrieveComponentStyles, getColor, getLineHeight } from '@zendeskgarden/react-theming';
 
 const COMPONENT_ID = 'dropdowns.combobox.input';
-const colorStyles = props => {
-  const placeholderColor = getColorV8('neutralHue', 400, props.theme);
+const colorStyles = _ref => {
+  let {
+    theme
+  } = _ref;
+  const placeholderColor = getColor({
+    theme,
+    variable: 'foreground.disabled'
+  });
   return css(["background-color:inherit;color:inherit;&::placeholder{opacity:1;color:", ";}"], placeholderColor);
 };
 const getHeight = props => {
@@ -29,13 +35,10 @@ const sizeStyles = props => {
 };
 const StyledInput = styled.input.attrs({
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.0.0-next.9'
+  'data-garden-version': '9.0.0'
 }).withConfig({
   displayName: "StyledInput",
   componentId: "sc-1lkqdg-0"
 })(["flex-basis:0;flex-grow:1;border:none;padding:0;font-family:inherit;&:focus{outline:none;}", ";", ";&[hidden]{display:revert;", "}&[aria-hidden='true']{display:none;}", ";"], sizeStyles, colorStyles, props => props.isEditable && hideVisually(), props => retrieveComponentStyles(COMPONENT_ID, props));
-StyledInput.defaultProps = {
-  theme: DEFAULT_THEME
-};
 
 export { StyledInput, getHeight, sizeStyles };

package/dist/esm/views/combobox/StyledInputGroup.js

@@ -5,7 +5,7 @@
 * found at http://www.apache.org/licenses/LICENSE-2.0.
 */
 import styled, { css } from 'styled-components';
-import { retrieveComponentStyles, DEFAULT_THEME } from '@zendeskgarden/react-theming';
+import { retrieveComponentStyles } from '@zendeskgarden/react-theming';
 
 const COMPONENT_ID = 'dropdowns.combobox.input_group';
 const sizeStyles = props => {
@@ -14,13 +14,10 @@ const sizeStyles = props => {
 };
 const StyledInputGroup = styled.div.attrs({
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.0.0-next.9'
+  'data-garden-version': '9.0.0'
 }).withConfig({
   displayName: "StyledInputGroup",
   componentId: "sc-yx3q7u-0"
 })(["display:flex;flex-grow:1;flex-wrap:wrap;", ";", ";"], sizeStyles, props => retrieveComponentStyles(COMPONENT_ID, props));
-StyledInputGroup.defaultProps = {
-  theme: DEFAULT_THEME
-};
 
 export { StyledInputGroup };