@zendeskgarden/react-dropdowns 8.75.1 → 8.76.0

package/dist/esm/utils/useItemContext.js

@@ -0,0 +1,18 @@
+/**
+* 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 React__default, { useContext } from 'react';
+
+const ItemContext = React__default.createContext(undefined);
+const useItemContext = () => {
+  const context = useContext(ItemContext);
+  if (!context) {
+    throw new Error('This component must be rendered within an `Item` component.');
+  }
+  return context;
+};
+
+export { ItemContext, useItemContext as default };

package/dist/esm/utils/useMenuContext.js

@@ -0,0 +1,18 @@
+/**
+* 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 React__default, { useContext } from 'react';
+
+const MenuContext = React__default.createContext(undefined);
+const useMenuContext = () => {
+  const menuContext = useContext(MenuContext);
+  if (!menuContext) {
+    throw new Error('This component must be rendered within a `Menu` component.');
+  }
+  return menuContext;
+};
+
+export { MenuContext, useMenuContext as default };

package/dist/index.cjs.js

@@ -1,10 +1,9 @@
 /**
- * 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.
- */
-
+* 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.
+*/
 'use strict';
 
 var React = require('react');
@@ -46,21 +45,6 @@ var styled__default = /*#__PURE__*/_interopDefault(styled);
 var Downshift__default = /*#__PURE__*/_interopDefault(Downshift);
 var mergeRefs__default = /*#__PURE__*/_interopDefault(mergeRefs);
 
-function _extends$5() {
-  _extends$5 = 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$5.apply(this, arguments);
-}
-
 const DropdownContext = React__namespace.default.createContext(undefined);
 const useDropdownContext = () => {
   const dropdownContext = React.useContext(DropdownContext);
@@ -143,7 +127,7 @@ const Dropdown = props => {
       ...downshift
     };
   };
-  return React__namespace.default.createElement(reactPopper.Manager, null, React__namespace.default.createElement(Downshift__default.default, _extends$5({
+  return React__namespace.default.createElement(reactPopper.Manager, null, React__namespace.default.createElement(Downshift__default.default, Object.assign({
     suppressRefError: true
     ,
     isOpen: isOpen,
@@ -306,7 +290,7 @@ function getMenuPosition(popperPlacement) {
 const COMPONENT_ID$m = 'dropdowns.menu';
 const StyledMenu = styled__default.default.ul.attrs(props => ({
   'data-garden-id': COMPONENT_ID$m,
-  'data-garden-version': '8.75.1',
+  'data-garden-version': '8.76.0',
   className: props.isAnimated && 'is-animated'
 })).withConfig({
   displayName: "StyledMenu",
@@ -323,7 +307,7 @@ StyledMenu.defaultProps = {
 const COMPONENT_ID$l = 'dropdowns.menu_wrapper';
 const StyledMenuWrapper = styled__default.default.div.attrs(props => ({
   'data-garden-id': COMPONENT_ID$l,
-  'data-garden-version': '8.75.1',
+  'data-garden-version': '8.76.0',
   className: props.isAnimated && 'is-animated'
 })).withConfig({
   displayName: "StyledMenuWrapper",
@@ -342,7 +326,7 @@ StyledMenuWrapper.defaultProps = {
 const COMPONENT_ID$k = 'dropdowns.separator';
 const StyledSeparator = styled__default.default.li.attrs({
   'data-garden-id': COMPONENT_ID$k,
-  'data-garden-version': '8.75.1',
+  'data-garden-version': '8.76.0',
   role: 'separator'
 }).withConfig({
   displayName: "StyledSeparator",
@@ -375,7 +359,7 @@ const getColorV8Styles = props => {
 };
 const StyledItem = styled__default.default.li.attrs(props => ({
   'data-garden-id': COMPONENT_ID$j,
-  'data-garden-version': '8.75.1',
+  'data-garden-version': '8.76.0',
   'aria-disabled': props.disabled
 })).withConfig({
   displayName: "StyledItem",
@@ -388,7 +372,7 @@ StyledItem.defaultProps = {
 const COMPONENT_ID$i = 'dropdowns.add_item';
 const StyledAddItem = styled__default.default(StyledItem).attrs({
   'data-garden-id': COMPONENT_ID$i,
-  'data-garden-version': '8.75.1'
+  'data-garden-version': '8.76.0'
 }).withConfig({
   displayName: "StyledAddItem",
   componentId: "sc-ekqk50-0"
@@ -400,7 +384,7 @@ StyledAddItem.defaultProps = {
 const COMPONENT_ID$h = 'dropdowns.item_meta';
 const StyledItemMeta = styled__default.default.span.attrs({
   'data-garden-id': COMPONENT_ID$h,
-  'data-garden-version': '8.75.1'
+  'data-garden-version': '8.76.0'
 }).withConfig({
   displayName: "StyledItemMeta",
   componentId: "sc-k6xy28-0"
@@ -415,7 +399,7 @@ const getSizeStyles = props => {
 };
 const StyledItemIcon = styled__default.default.div.attrs({
   'data-garden-id': COMPONENT_ID$g,
-  'data-garden-version': '8.75.1'
+  'data-garden-version': '8.76.0'
 }).withConfig({
   displayName: "StyledItemIcon",
   componentId: "sc-1v0ty11-0"
@@ -427,7 +411,7 @@ StyledItemIcon.defaultProps = {
 const COMPONENT_ID$f = 'dropdowns.next_item';
 const StyledNextItem = styled__default.default(StyledItem).attrs({
   'data-garden-id': COMPONENT_ID$f,
-  'data-garden-version': '8.75.1'
+  'data-garden-version': '8.76.0'
 }).withConfig({
   displayName: "StyledNextItem",
   componentId: "sc-1bcygn5-0"
@@ -459,7 +443,7 @@ const NextIconComponent = _ref => {
   } = _ref;
   return React__namespace.default.createElement(SvgChevronRightStroke, {
     "data-garden-id": COMPONENT_ID$e,
-    "data-garden-version": '8.75.1',
+    "data-garden-version": '8.76.0',
     className: className
   });
 };
@@ -474,7 +458,7 @@ StyledNextIcon.defaultProps = {
 const COMPONENT_ID$d = 'dropdowns.previous_item';
 const StyledPreviousItem = styled__default.default(StyledItem).attrs({
   'data-garden-id': COMPONENT_ID$d,
-  'data-garden-version': '8.75.1'
+  'data-garden-version': '8.76.0'
 }).withConfig({
   displayName: "StyledPreviousItem",
   componentId: "sc-1nmdds9-0"
@@ -506,7 +490,7 @@ const PreviousIconComponent = _ref => {
   } = _ref;
   return React__namespace.default.createElement(SvgChevronLeftStroke, {
     "data-garden-id": COMPONENT_ID$c,
-    "data-garden-version": '8.75.1',
+    "data-garden-version": '8.76.0',
     className: className
   });
 };
@@ -521,7 +505,7 @@ StyledPreviousIcon.defaultProps = {
 const COMPONENT_ID$b = 'dropdowns.header_icon';
 const StyledHeaderIcon = styled__default.default.div.attrs({
   'data-garden-id': COMPONENT_ID$b,
-  'data-garden-version': '8.75.1'
+  'data-garden-version': '8.76.0'
 }).withConfig({
   displayName: "StyledHeaderIcon",
   componentId: "sc-1fl6nsz-0"
@@ -539,7 +523,7 @@ const getHorizontalPadding = props => {
 };
 const StyledHeaderItem = styled__default.default(StyledItem).attrs({
   'data-garden-id': COMPONENT_ID$a,
-  'data-garden-version': '8.75.1'
+  'data-garden-version': '8.76.0'
 }).withConfig({
   displayName: "StyledHeaderItem",
   componentId: "sc-137filx-0"
@@ -551,7 +535,7 @@ StyledHeaderItem.defaultProps = {
 const COMPONENT_ID$9 = 'dropdowns.media_body';
 const StyledMediaBody = styled__default.default.div.attrs({
   'data-garden-id': COMPONENT_ID$9,
-  'data-garden-version': '8.75.1'
+  'data-garden-version': '8.76.0'
 }).withConfig({
   displayName: "StyledMediaBody",
   componentId: "sc-36j7ef-0"
@@ -574,7 +558,7 @@ _ref => {
   );
 }).attrs({
   'data-garden-id': COMPONENT_ID$8,
-  'data-garden-version': '8.75.1'
+  'data-garden-version': '8.76.0'
 }).withConfig({
   displayName: "StyledMediaFigure",
   componentId: "sc-2f2x8x-0"
@@ -586,7 +570,7 @@ StyledMediaFigure.defaultProps = {
 const COMPONENT_ID$7 = 'dropdowns.media_item';
 const StyledMediaItem = styled__default.default(StyledItem).attrs({
   'data-garden-id': COMPONENT_ID$7,
-  'data-garden-version': '8.75.1'
+  'data-garden-version': '8.76.0'
 }).withConfig({
   displayName: "StyledMediaItem",
   componentId: "sc-ikwshz-0"
@@ -598,7 +582,7 @@ StyledMediaItem.defaultProps = {
 const COMPONENT_ID$6 = 'dropdowns.faux_input';
 const StyledFauxInput = styled__default.default(reactForms.FauxInput).attrs(props => ({
   'data-garden-id': COMPONENT_ID$6,
-  'data-garden-version': '8.75.1',
+  'data-garden-version': '8.76.0',
   mediaLayout: true,
   theme: props.theme
 })).withConfig({
@@ -613,7 +597,7 @@ const COMPONENT_ID$5 = 'dropdowns.input';
 const hiddenStyling = styled.css(["position:fixed;border:0;clip:rect(1px,1px,1px,1px);padding:0;width:1px;height:1px;overflow:hidden;white-space:nowrap;"]);
 const StyledInput = styled__default.default(reactForms.Input).attrs({
   'data-garden-id': COMPONENT_ID$5,
-  'data-garden-version': '8.75.1',
+  'data-garden-version': '8.76.0',
   isBare: true
 }).withConfig({
   displayName: "StyledInput",
@@ -626,7 +610,7 @@ StyledInput.defaultProps = {
 const COMPONENT_ID$4 = 'dropdowns.select';
 const StyledSelect = styled__default.default.div.attrs({
   'data-garden-id': COMPONENT_ID$4,
-  'data-garden-version': '8.75.1'
+  'data-garden-version': '8.76.0'
 }).withConfig({
   displayName: "StyledSelect",
   componentId: "sc-xifmwj-0"
@@ -647,7 +631,7 @@ const visibleStyling = props => {
 };
 const StyledMultiselectInput = styled__default.default(StyledInput).attrs({
   'data-garden-id': COMPONENT_ID$3,
-  'data-garden-version': '8.75.1',
+  'data-garden-version': '8.76.0',
   isBare: true
 }).withConfig({
   displayName: "StyledMultiselectInput",
@@ -672,7 +656,7 @@ const sizeStyles = props => {
 };
 const StyledMultiselectItemsContainer = styled__default.default.div.attrs({
   'data-garden-id': COMPONENT_ID$2,
-  'data-garden-version': '8.75.1'
+  'data-garden-version': '8.76.0'
 }).withConfig({
   displayName: "StyledMultiselectItemsContainer",
   componentId: "sc-1jzhet8-0"
@@ -684,7 +668,7 @@ StyledMultiselectItemsContainer.defaultProps = {
 const COMPONENT_ID$1 = 'dropdowns.multiselect_item_wrapper';
 const StyledMultiselectItemWrapper = styled__default.default.div.attrs({
   'data-garden-id': COMPONENT_ID$1,
-  'data-garden-version': '8.75.1'
+  'data-garden-version': '8.76.0'
 }).withConfig({
   displayName: "StyledMultiselectItemWrapper",
   componentId: "sc-1rb2bye-0"
@@ -696,7 +680,7 @@ StyledMultiselectItemWrapper.defaultProps = {
 const COMPONENT_ID = 'dropdowns.multiselect_more_anchor';
 const StyledMultiselectMoreAnchor = styled__default.default.div.attrs({
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '8.75.1'
+  'data-garden-version': '8.76.0'
 }).withConfig({
   displayName: "StyledMultiselectMoreAnchor",
   componentId: "sc-1m9v46e-0"
@@ -935,7 +919,7 @@ const Autocomplete = React.forwardRef((_ref, ref) => {
     let {
       ref: popperReference
     } = _ref2;
-    return React__namespace.default.createElement(StyledFauxInput, _extends$5({
+    return React__namespace.default.createElement(StyledFauxInput, Object.assign({
       isHovered: isContainerHovered,
       isFocused: isContainerFocused,
       tabIndex: null,
@@ -1057,7 +1041,7 @@ const Combobox = React.forwardRef((_ref, ref) => {
       mergeRefs__default.default([wrapperRef, ref])(element);
       popperReferenceElementRef.current = element;
     };
-    return React__namespace.default.createElement(reactForms.MediaInput, _extends$5({}, inputProps, {
+    return React__namespace.default.createElement(reactForms.MediaInput, Object.assign({}, inputProps, {
       wrapperProps: wrapperProps,
       wrapperRef: wrapperRefProp,
       ref: mergeRefs__default.default([inputRef, inputRefProp])
@@ -1459,7 +1443,7 @@ const Select = React__namespace.default.forwardRef((_ref, ref) => {
     let {
       ref: popperReference
     } = _ref2;
-    return React__namespace.default.createElement(StyledFauxInput, _extends$5({
+    return React__namespace.default.createElement(StyledFauxInput, Object.assign({
       isHovered: isContainerHovered,
       isFocused: isContainerFocused
     }, selectProps, {
@@ -1518,13 +1502,13 @@ const Field = React.forwardRef((props, fieldRef) => {
   }), [isLabelHovered, setIsLabelHovered]);
   return React__namespace.default.createElement(FieldContext.Provider, {
     value: value
-  }, React__namespace.default.createElement(reactForms.Field, _extends$5({
+  }, React__namespace.default.createElement(reactForms.Field, Object.assign({
     ref: mergeRefs__default.default([ref, fieldRef])
   }, props)));
 });
 Field.displayName = 'Field';
 
-const Hint = React__namespace.default.forwardRef((props, ref) => React__namespace.default.createElement(reactForms.Hint, _extends$5({
+const Hint = React__namespace.default.forwardRef((props, ref) => React__namespace.default.createElement(reactForms.Hint, Object.assign({
   ref: ref
 }, props)));
 Hint.displayName = 'Hint';
@@ -1552,7 +1536,7 @@ const Label = React__namespace.default.forwardRef((_ref, ref) => {
     }),
     ...other
   });
-  return React__namespace.default.createElement(reactForms.Label, _extends$5({
+  return React__namespace.default.createElement(reactForms.Label, Object.assign({
     ref: ref
   }, labelProps));
 });
@@ -1561,7 +1545,7 @@ Label.propTypes = {
   isRegular: PropTypes__default.default.bool
 };
 
-const Message = React__namespace.default.forwardRef((props, ref) => React__namespace.default.createElement(reactForms.Message, _extends$5({
+const Message = React__namespace.default.forwardRef((props, ref) => React__namespace.default.createElement(reactForms.Message, Object.assign({
   ref: ref
 }, props)));
 Message.displayName = 'Message';
@@ -1671,7 +1655,7 @@ const Menu = React.forwardRef((props, menuRef) => {
         isHidden: !isOpen,
         isAnimated: menuProps.isAnimated,
         zIndex: zIndex
-      }, React__namespace.default.createElement(StyledMenu, _extends$5({
+      }, React__namespace.default.createElement(StyledMenu, Object.assign({
         ref: menuRef,
         isCompact: isCompact,
         maxHeight: maxHeight,
@@ -1701,7 +1685,7 @@ Menu.defaultProps = {
   zIndex: 1000
 };
 
-const Separator = React__namespace.default.forwardRef((props, ref) => React__namespace.default.createElement(StyledSeparator, _extends$5({
+const Separator = React__namespace.default.forwardRef((props, ref) => React__namespace.default.createElement(StyledSeparator, Object.assign({
   ref: ref
 }, props)));
 Separator.displayName = 'Separator';
@@ -1817,7 +1801,7 @@ const Item = React__namespace.default.forwardRef((_ref, forwardRef) => {
   if (disabled) {
     return React__namespace.default.createElement(ItemContext.Provider, {
       value: contextValue
-    }, React__namespace.default.createElement(Component, _extends$5({
+    }, React__namespace.default.createElement(Component, Object.assign({
       ref: ref,
       disabled: disabled,
       isDanger: isDanger,
@@ -1862,7 +1846,7 @@ const AddItemComponent = React__namespace.default.forwardRef((_ref, ref) => {
   const {
     isCompact
   } = useMenuContext();
-  return React__namespace.default.createElement(StyledAddItem, _extends$5({
+  return React__namespace.default.createElement(StyledAddItem, Object.assign({
     ref: ref,
     disabled: disabled
   }, props), React__namespace.default.createElement(StyledItemIcon, {
@@ -1871,7 +1855,7 @@ const AddItemComponent = React__namespace.default.forwardRef((_ref, ref) => {
     isDisabled: disabled
   }, React__namespace.default.createElement(SvgPlusStroke, null)), children);
 });
-const AddItem = React__namespace.default.forwardRef((props, ref) => React__namespace.default.createElement(Item, _extends$5({
+const AddItem = React__namespace.default.forwardRef((props, ref) => React__namespace.default.createElement(Item, Object.assign({
   component: AddItemComponent,
   ref: ref
 }, props, {
@@ -1887,7 +1871,7 @@ const HeaderIcon = React__namespace.default.forwardRef((props, ref) => {
   const {
     isCompact
   } = useMenuContext();
-  return React__namespace.default.createElement(StyledHeaderIcon, _extends$5({
+  return React__namespace.default.createElement(StyledHeaderIcon, Object.assign({
     ref: ref,
     isCompact: isCompact
   }, props));
@@ -1898,7 +1882,7 @@ const HeaderItem = React__namespace.default.forwardRef((props, ref) => {
   const {
     isCompact
   } = useMenuContext();
-  return React__namespace.default.createElement(StyledHeaderItem, _extends$5({
+  return React__namespace.default.createElement(StyledHeaderItem, Object.assign({
     ref: ref,
     isCompact: isCompact
   }, props));
@@ -1912,7 +1896,7 @@ const ItemMeta = React__namespace.default.forwardRef((props, ref) => {
   const {
     isDisabled
   } = useItemContext();
-  return React__namespace.default.createElement(StyledItemMeta, _extends$5({
+  return React__namespace.default.createElement(StyledItemMeta, Object.assign({
     ref: ref,
     isCompact: isCompact,
     isDisabled: isDisabled
@@ -1924,7 +1908,7 @@ const MediaBody = React__namespace.default.forwardRef((props, ref) => {
   const {
     isCompact
   } = useMenuContext();
-  return React__namespace.default.createElement(StyledMediaBody, _extends$5({
+  return React__namespace.default.createElement(StyledMediaBody, Object.assign({
     ref: ref,
     isCompact: isCompact
   }, props));
@@ -1935,12 +1919,12 @@ const MediaFigure = props => {
   const {
     isCompact
   } = useMenuContext();
-  return React__namespace.default.createElement(StyledMediaFigure, _extends$5({
+  return React__namespace.default.createElement(StyledMediaFigure, Object.assign({
     isCompact: isCompact
   }, props));
 };
 
-const MediaItem = React__namespace.default.forwardRef((props, ref) => React__namespace.default.createElement(Item, _extends$5({
+const MediaItem = React__namespace.default.forwardRef((props, ref) => React__namespace.default.createElement(Item, Object.assign({
   component: StyledMediaItem,
   ref: ref
 }, props)));
@@ -1959,7 +1943,7 @@ const NextItemComponent = React__namespace.default.forwardRef((_ref, ref) => {
   const {
     isCompact
   } = useMenuContext();
-  return React__namespace.default.createElement(StyledNextItem, _extends$5({
+  return React__namespace.default.createElement(StyledNextItem, Object.assign({
     ref: ref,
     disabled: disabled
   }, props), React__namespace.default.createElement(StyledItemIcon, {
@@ -1988,7 +1972,7 @@ const NextItem = React__namespace.default.forwardRef((_ref2, ref) => {
   if (!disabled) {
     nextItemsHashRef.current[itemToString(value)] = itemIndexRef.current;
   }
-  return React__namespace.default.createElement(Item, _extends$5({
+  return React__namespace.default.createElement(Item, Object.assign({
     component: NextItemComponent,
     "aria-expanded": true,
     disabled: disabled,
@@ -2013,7 +1997,7 @@ const PreviousItemComponent = React__namespace.default.forwardRef((_ref, ref) =>
   const {
     isCompact
   } = useMenuContext();
-  return React__namespace.default.createElement(StyledPreviousItem, _extends$5({
+  return React__namespace.default.createElement(StyledPreviousItem, Object.assign({
     ref: ref,
     disabled: disabled
   }, props), React__namespace.default.createElement(StyledItemIcon, {
@@ -2039,7 +2023,7 @@ const PreviousItem = React__namespace.default.forwardRef((_ref2, ref) => {
   if (!disabled) {
     previousIndexRef.current = itemIndexRef.current;
   }
-  return React__namespace.default.createElement(Item, _extends$5({
+  return React__namespace.default.createElement(Item, Object.assign({
     component: PreviousItemComponent,
     "aria-expanded": true,
     value: value,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zendeskgarden/react-dropdowns",
-  "version": "8.75.1",
+  "version": "8.76.0",
   "description": "Components relating to dropdowns in the Garden Design System",
   "license": "Apache-2.0",
   "author": "Zendesk Garden <garden@zendesk.com>",
@@ -10,7 +10,7 @@
     "url": "https://github.com/zendeskgarden/react-components/issues"
   },
   "main": "dist/index.cjs.js",
-  "module": "dist/index.esm.js",
+  "module": "dist/esm/index.js",
   "files": [
     "dist"
   ],
@@ -23,7 +23,7 @@
   "dependencies": {
     "@zendeskgarden/container-selection": "^2.0.0",
     "@zendeskgarden/container-utilities": "^1.0.14",
-    "@zendeskgarden/react-forms": "^8.75.1",
+    "@zendeskgarden/react-forms": "^8.76.0",
     "downshift": "^7.0.0",
     "polished": "^4.0.0",
     "prop-types": "^15.5.7",
@@ -31,14 +31,14 @@
     "react-popper": "^1.3.4"
   },
   "peerDependencies": {
-    "@zendeskgarden/react-theming": "^8.67.0",
+    "@zendeskgarden/react-theming": "^8.75.0",
     "react": ">=16.8.0",
     "react-dom": ">=16.8.0",
     "styled-components": "^4.2.0 || ^5.0.0"
   },
   "devDependencies": {
     "@types/lodash.debounce": "4.0.9",
-    "@zendeskgarden/react-theming": "^8.75.1",
+    "@zendeskgarden/react-theming": "^8.76.0",
     "@zendeskgarden/svg-icons": "7.0.0",
     "lodash.debounce": "4.0.8"
   },
@@ -52,5 +52,5 @@
     "access": "public"
   },
   "zendeskgarden:src": "src/index.ts",
-  "gitHead": "8e2bb36bcfef722db47a135fc987f72597be5000"
+  "gitHead": "3e52650c39fd1085a2e97b40a43eed7bc1e21937"
 }