@zendeskgarden/react-dropdowns 9.6.0 → 9.7.0

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

@@ -39,6 +39,7 @@ import { StyledValue } from '../../views/combobox/StyledValue.js';
 import '../../views/menu/StyledMenu.js';
 import '../../views/menu/StyledFloatingMenu.js';
 import '../../views/menu/StyledItem.js';
+import '../../views/menu/StyledItemAnchor.js';
 import '../../views/menu/StyledItemContent.js';
 import '../../views/menu/StyledItemGroup.js';
 import '../../views/menu/StyledItemIcon.js';

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

@@ -32,6 +32,7 @@ import '../../views/combobox/StyledValue.js';
 import '../../views/menu/StyledMenu.js';
 import '../../views/menu/StyledFloatingMenu.js';
 import '../../views/menu/StyledItem.js';
+import '../../views/menu/StyledItemAnchor.js';
 import '../../views/menu/StyledItemContent.js';
 import '../../views/menu/StyledItemGroup.js';
 import '../../views/menu/StyledItemIcon.js';

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

@@ -32,6 +32,7 @@ import '../../views/combobox/StyledValue.js';
 import '../../views/menu/StyledMenu.js';
 import '../../views/menu/StyledFloatingMenu.js';
 import '../../views/menu/StyledItem.js';
+import '../../views/menu/StyledItemAnchor.js';
 import '../../views/menu/StyledItemContent.js';
 import '../../views/menu/StyledItemGroup.js';
 import '../../views/menu/StyledItemIcon.js';

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

@@ -34,6 +34,7 @@ import '../../views/combobox/StyledValue.js';
 import '../../views/menu/StyledMenu.js';
 import '../../views/menu/StyledFloatingMenu.js';
 import '../../views/menu/StyledItem.js';
+import '../../views/menu/StyledItemAnchor.js';
 import '../../views/menu/StyledItemContent.js';
 import '../../views/menu/StyledItemGroup.js';
 import '../../views/menu/StyledItemIcon.js';

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

@@ -34,6 +34,7 @@ import '../../views/combobox/StyledValue.js';
 import '../../views/menu/StyledMenu.js';
 import '../../views/menu/StyledFloatingMenu.js';
 import '../../views/menu/StyledItem.js';
+import '../../views/menu/StyledItemAnchor.js';
 import '../../views/menu/StyledItemContent.js';
 import '../../views/menu/StyledItemGroup.js';
 import '../../views/menu/StyledItemIcon.js';

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

@@ -34,6 +34,7 @@ import '../../views/combobox/StyledValue.js';
 import '../../views/menu/StyledMenu.js';
 import '../../views/menu/StyledFloatingMenu.js';
 import '../../views/menu/StyledItem.js';
+import '../../views/menu/StyledItemAnchor.js';
 import '../../views/menu/StyledItemContent.js';
 import '../../views/menu/StyledItemGroup.js';
 import '../../views/menu/StyledItemIcon.js';

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

@@ -35,6 +35,7 @@ import '../../views/combobox/StyledValue.js';
 import '../../views/menu/StyledMenu.js';
 import '../../views/menu/StyledFloatingMenu.js';
 import '../../views/menu/StyledItem.js';
+import '../../views/menu/StyledItemAnchor.js';
 import '../../views/menu/StyledItemContent.js';
 import '../../views/menu/StyledItemGroup.js';
 import '../../views/menu/StyledItemIcon.js';

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

@@ -41,6 +41,7 @@ import '../../views/combobox/StyledValue.js';
 import '../../views/menu/StyledMenu.js';
 import '../../views/menu/StyledFloatingMenu.js';
 import '../../views/menu/StyledItem.js';
+import '../../views/menu/StyledItemAnchor.js';
 import '../../views/menu/StyledItemContent.js';
 import '../../views/menu/StyledItemGroup.js';
 import '../../views/menu/StyledItemIcon.js';

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

@@ -32,6 +32,7 @@ import '../../views/combobox/StyledValue.js';
 import '../../views/menu/StyledMenu.js';
 import '../../views/menu/StyledFloatingMenu.js';
 import '../../views/menu/StyledItem.js';
+import '../../views/menu/StyledItemAnchor.js';
 import '../../views/menu/StyledItemContent.js';
 import '../../views/menu/StyledItemGroup.js';
 import '../../views/menu/StyledItemIcon.js';

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

@@ -36,6 +36,7 @@ import '../../views/combobox/StyledValue.js';
 import '../../views/menu/StyledMenu.js';
 import '../../views/menu/StyledFloatingMenu.js';
 import '../../views/menu/StyledItem.js';
+import '../../views/menu/StyledItemAnchor.js';
 import '../../views/menu/StyledItemContent.js';
 import '../../views/menu/StyledItemGroup.js';
 import '../../views/menu/StyledItemIcon.js';

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

@@ -38,6 +38,7 @@ import '../../views/combobox/StyledValue.js';
 import '../../views/menu/StyledMenu.js';
 import '../../views/menu/StyledFloatingMenu.js';
 import { StyledItem } from '../../views/menu/StyledItem.js';
+import { StyledItemAnchor } from '../../views/menu/StyledItemAnchor.js';
 import { StyledItemContent } from '../../views/menu/StyledItemContent.js';
 import '../../views/menu/StyledItemGroup.js';
 import { StyledItemIcon } from '../../views/menu/StyledItemIcon.js';
@@ -50,26 +51,41 @@ import useItemGroupContext from '../../context/useItemGroupContext.js';
 import { ItemContext } from '../../context/useItemContext.js';
 import { toItem } from './utils.js';
 
+const renderActionIcon = itemType => {
+  switch (itemType) {
+    case 'add':
+      return React__default.createElement(SvgPlusStroke, null);
+    case 'next':
+      return React__default.createElement(SvgChevronRightStroke, null);
+    case 'previous':
+      return React__default.createElement(SvgChevronLeftStroke, null);
+    default:
+      return React__default.createElement(SvgCheckLgStroke, null);
+  }
+};
 const ItemComponent = forwardRef((_ref, ref) => {
   let {
     children,
     value,
     label = value,
+    href,
     isSelected,
     icon,
     isDisabled,
+    isExternal,
     type,
     name,
     onClick,
     onKeyDown,
     onMouseEnter,
-    ...props
+    ...other
   } = _ref;
   const {
     type: selectionType
   } = useItemGroupContext();
   const {
     focusedValue,
+    getAnchorProps,
     getItemProps,
     isCompact
   } = useMenuContext();
@@ -80,10 +96,18 @@ const ItemComponent = forwardRef((_ref, ref) => {
       name,
       type,
       isSelected,
-      isDisabled
+      isDisabled,
+      href,
+      isExternal
     }),
     type: selectionType
   };
+  const anchorProps = getAnchorProps({
+    item
+  });
+  if (anchorProps && (type === 'add' || type === 'danger')) {
+    throw new Error(`Menu link item '${value}' can't use type '${type}'`);
+  }
   const {
     ref: _itemRef,
     ...itemProps
@@ -93,44 +117,40 @@ const ItemComponent = forwardRef((_ref, ref) => {
     onKeyDown,
     onMouseEnter
   });
-  const isActive = value === focusedValue;
-  const renderActionIcon = iconType => {
-    switch (iconType) {
-      case 'add':
-        return React__default.createElement(SvgPlusStroke, null);
-      case 'next':
-        return React__default.createElement(SvgChevronRightStroke, null);
-      case 'previous':
-        return React__default.createElement(SvgChevronLeftStroke, null);
-      default:
-        return React__default.createElement(SvgCheckLgStroke, null);
-    }
-  };
   const contextValue = useMemo(() => ({
     isDisabled,
     type
   }), [isDisabled, type]);
-  return React__default.createElement(ItemContext.Provider, {
-    value: contextValue
-  }, React__default.createElement(StyledItem, Object.assign({
-    $type: type,
-    $isCompact: isCompact,
-    $isActive: isActive
-  }, props, itemProps, {
-    ref: mergeRefs([_itemRef, ref])
-  }), React__default.createElement(StyledItemTypeIcon, {
+  const itemChildren = React__default.createElement(React__default.Fragment, null, React__default.createElement(StyledItemTypeIcon, {
     $isCompact: isCompact,
     $type: type
   }, renderActionIcon(type)), !!icon && React__default.createElement(StyledItemIcon, {
     $isDisabled: isDisabled,
     $type: type
-  }, icon), React__default.createElement(StyledItemContent, null, children || label)));
+  }, icon), React__default.createElement(StyledItemContent, null, children || label));
+  const menuItemProps = {
+    ...other,
+    ...itemProps,
+    ref: mergeRefs([_itemRef, ref])
+  };
+  return React__default.createElement(ItemContext.Provider, {
+    value: contextValue
+  }, anchorProps ? React__default.createElement("li", menuItemProps, React__default.createElement(StyledItemAnchor, Object.assign({
+    $isCompact: isCompact,
+    $isActive: value === focusedValue
+  }, anchorProps), itemChildren)) : React__default.createElement(StyledItem, Object.assign({
+    $isCompact: isCompact,
+    $isActive: value === focusedValue,
+    $type: type
+  }, menuItemProps), itemChildren));
 });
 ItemComponent.displayName = 'Item';
 ItemComponent.propTypes = {
+  href: PropTypes.string,
   icon: PropTypes.any,
   isDisabled: PropTypes.bool,
   isSelected: PropTypes.bool,
+  isExternal: PropTypes.bool,
   label: PropTypes.string,
   name: PropTypes.string,
   type: PropTypes.oneOf(OPTION_TYPE),

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

@@ -34,6 +34,7 @@ import '../../views/combobox/StyledValue.js';
 import '../../views/menu/StyledMenu.js';
 import '../../views/menu/StyledFloatingMenu.js';
 import { StyledItem } from '../../views/menu/StyledItem.js';
+import '../../views/menu/StyledItemAnchor.js';
 import { StyledItemContent } from '../../views/menu/StyledItemContent.js';
 import { StyledItemGroup } from '../../views/menu/StyledItemGroup.js';
 import '../../views/menu/StyledItemIcon.js';

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

@@ -32,6 +32,7 @@ import '../../views/combobox/StyledValue.js';
 import '../../views/menu/StyledMenu.js';
 import '../../views/menu/StyledFloatingMenu.js';
 import '../../views/menu/StyledItem.js';
+import '../../views/menu/StyledItemAnchor.js';
 import '../../views/menu/StyledItemContent.js';
 import '../../views/menu/StyledItemGroup.js';
 import '../../views/menu/StyledItemIcon.js';

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

@@ -43,6 +43,7 @@ const Menu = forwardRef((_ref2, ref) => {
     focusedValue,
     getTriggerProps,
     getMenuProps,
+    getAnchorProps,
     getItemProps,
     getItemGroupProps,
     getSeparatorProps
@@ -86,10 +87,11 @@ const Menu = forwardRef((_ref2, ref) => {
   const contextValue = useMemo(() => ({
     isCompact,
     focusedValue,
+    getAnchorProps,
     getItemProps,
     getItemGroupProps,
     getSeparatorProps
-  }), [isCompact, focusedValue, getItemProps, getItemGroupProps, getSeparatorProps]);
+  }), [focusedValue, getAnchorProps, getItemGroupProps, getItemProps, getSeparatorProps, isCompact]);
   return React__default.createElement(MenuContext.Provider, {
     value: contextValue
   }, trigger, React__default.createElement(MenuList, Object.assign({}, props, getMenuProps({

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

@@ -36,6 +36,7 @@ import '../../views/combobox/StyledValue.js';
 import { StyledMenu } from '../../views/menu/StyledMenu.js';
 import { StyledFloatingMenu } from '../../views/menu/StyledFloatingMenu.js';
 import '../../views/menu/StyledItem.js';
+import '../../views/menu/StyledItemAnchor.js';
 import '../../views/menu/StyledItemContent.js';
 import '../../views/menu/StyledItemGroup.js';
 import '../../views/menu/StyledItemIcon.js';

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

@@ -31,6 +31,7 @@ import '../../views/combobox/StyledValue.js';
 import '../../views/menu/StyledMenu.js';
 import '../../views/menu/StyledFloatingMenu.js';
 import '../../views/menu/StyledItem.js';
+import '../../views/menu/StyledItemAnchor.js';
 import '../../views/menu/StyledItemContent.js';
 import '../../views/menu/StyledItemGroup.js';
 import '../../views/menu/StyledItemIcon.js';

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

@@ -12,9 +12,15 @@ const toItem = props => ({
   ...(props.name && {
     name: props.name
   }),
+  ...(props.href && {
+    href: props.href
+  }),
   ...(props.isDisabled && {
     disabled: props.isDisabled
   }),
+  ...(props.isExternal && {
+    external: props.isExternal
+  }),
   ...(props.isSelected && {
     selected: props.isSelected
   }),

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

@@ -18,7 +18,7 @@ const sizeStyles = props => {
 };
 const StyledCombobox = styled.div.attrs({
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.6.0'
+  'data-garden-version': '9.7.0'
 }).withConfig({
   displayName: "StyledCombobox",
   componentId: "sc-13eybg8-0"

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

@@ -10,7 +10,7 @@ import { componentStyles } from '@zendeskgarden/react-theming';
 const COMPONENT_ID = 'dropdowns.combobox.container';
 const StyledContainer = styled.div.attrs({
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.6.0'
+  'data-garden-version': '9.7.0'
 }).withConfig({
   displayName: "StyledContainer",
   componentId: "sc-14i9jid-0"

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

@@ -10,7 +10,7 @@ import { componentStyles } from '@zendeskgarden/react-theming';
 const COMPONENT_ID = 'dropdowns.combobox.field';
 const StyledField = styled.div.attrs({
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.6.0'
+  'data-garden-version': '9.7.0'
 }).withConfig({
   displayName: "StyledField",
   componentId: "sc-zc57xl-0"

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

@@ -10,7 +10,7 @@ import { menuStyles, componentStyles } from '@zendeskgarden/react-theming';
 const COMPONENT_ID = 'dropdowns.combobox.floating';
 const StyledFloatingListbox = styled.div.attrs({
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.6.0'
+  'data-garden-version': '9.7.0'
 }).withConfig({
   displayName: "StyledFloatingListbox",
   componentId: "sc-1cp6spf-0"

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

@@ -11,7 +11,7 @@ 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.6.0'
+  'data-garden-version': '9.7.0'
 }).withConfig({
   displayName: "StyledHint",
   componentId: "sc-106qvqx-0"

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

@@ -35,7 +35,7 @@ const sizeStyles = props => {
 };
 const StyledInput = styled.input.attrs({
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.6.0'
+  'data-garden-version': '9.7.0'
 }).withConfig({
   displayName: "StyledInput",
   componentId: "sc-1lkqdg-0"

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

@@ -14,7 +14,7 @@ const sizeStyles = props => {
 };
 const StyledInputGroup = styled.div.attrs({
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.6.0'
+  'data-garden-version': '9.7.0'
 }).withConfig({
   displayName: "StyledInputGroup",
   componentId: "sc-yx3q7u-0"

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

@@ -50,7 +50,7 @@ const sizeStyles = props => {
 };
 const StyledInputIcon = styled(StyledBaseIcon).attrs({
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.6.0'
+  'data-garden-version': '9.7.0'
 }).withConfig({
   displayName: "StyledInputIcon",
   componentId: "sc-gqbs1s-0"

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

@@ -11,7 +11,7 @@ import { Field } from '@zendeskgarden/react-forms';
 const COMPONENT_ID = 'dropdowns.combobox.label';
 const StyledLabel = styled(Field.Label).attrs({
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.6.0'
+  'data-garden-version': '9.7.0'
 }).withConfig({
   displayName: "StyledLabel",
   componentId: "sc-az6now-0"

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

@@ -18,7 +18,7 @@ const sizeStyles = props => {
 };
 const StyledListbox = styled.ul.attrs({
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.6.0'
+  'data-garden-version': '9.7.0'
 }).withConfig({
   displayName: "StyledListbox",
   componentId: "sc-1k13ba7-0"

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

@@ -25,7 +25,7 @@ const sizeStyles = props => {
 };
 const StyledListboxSeparator = styled.li.attrs({
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.6.0'
+  'data-garden-version': '9.7.0'
 }).withConfig({
   displayName: "StyledListboxSeparator",
   componentId: "sc-1p6toh2-0"

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

@@ -11,7 +11,7 @@ import { Field } from '@zendeskgarden/react-forms';
 const COMPONENT_ID = 'dropdowns.combobox.message';
 const StyledMessage = styled(Field.Message).attrs({
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.6.0'
+  'data-garden-version': '9.7.0'
 }).withConfig({
   displayName: "StyledMessage",
   componentId: "sc-jux8m5-0"

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

@@ -10,7 +10,7 @@ import { componentStyles } from '@zendeskgarden/react-theming';
 const COMPONENT_ID = 'dropdowns.combobox.optgroup';
 const StyledOptGroup = styled.ul.attrs({
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.6.0'
+  'data-garden-version': '9.7.0'
 }).withConfig({
   displayName: "StyledOptGroup",
   componentId: "sc-1kavqsx-0"

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

@@ -57,7 +57,7 @@ const sizeStyles = props => {
 };
 const StyledOption = styled.li.attrs({
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.6.0'
+  'data-garden-version': '9.7.0'
 }).withConfig({
   displayName: "StyledOption",
   componentId: "sc-jl4wn6-0"

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

@@ -10,7 +10,7 @@ import { componentStyles } from '@zendeskgarden/react-theming';
 const COMPONENT_ID = 'dropdowns.combobox.option.content';
 const StyledOptionContent = styled.div.attrs({
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.6.0'
+  'data-garden-version': '9.7.0'
 }).withConfig({
   displayName: "StyledOptionContent",
   componentId: "sc-121ujpu-0"

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

@@ -39,7 +39,7 @@ const sizeStyles = props => {
 };
 const StyledOptionIcon = styled(StyledBaseIcon).attrs({
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.6.0'
+  'data-garden-version': '9.7.0'
 }).withConfig({
   displayName: "StyledOptionIcon",
   componentId: "sc-qsab3y-0"

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

@@ -27,7 +27,7 @@ const sizeStyles = props => {
 };
 const StyledOptionMeta = styled.div.attrs({
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.6.0'
+  'data-garden-version': '9.7.0'
 }).withConfig({
   displayName: "StyledOptionMeta",
   componentId: "sc-j6pu10-0"

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

@@ -36,7 +36,7 @@ const sizeStyles = _ref2 => {
 };
 const StyledOptionSelectionIcon = styled(StyledBaseIcon).attrs({
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.6.0'
+  'data-garden-version': '9.7.0'
 }).withConfig({
   displayName: "StyledOptionSelectionIcon",
   componentId: "sc-12wj24m-0"

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

@@ -46,7 +46,7 @@ const sizeStyles = props => {
 };
 const StyledOptionTypeIcon = styled(StyledBaseIcon).attrs({
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.6.0'
+  'data-garden-version': '9.7.0'
 }).withConfig({
   displayName: "StyledOptionTypeIcon",
   componentId: "sc-xpink2-0"

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

@@ -12,7 +12,7 @@ import { Tag } from '@zendeskgarden/react-tags';
 const COMPONENT_ID = 'dropdowns.combobox.tag';
 const StyledTag = styled(Tag).attrs({
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.6.0'
+  'data-garden-version': '9.7.0'
 }).withConfig({
   displayName: "StyledTag",
   componentId: "sc-1alam0r-0"

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

@@ -22,7 +22,7 @@ const colorStyles = _ref => {
 const StyledTagsButton = styled(StyledValue).attrs({
   as: 'button',
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.6.0'
+  'data-garden-version': '9.7.0'
 }).withConfig({
   displayName: "StyledTagsButton",
   componentId: "sc-6q5w33-0"

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

@@ -113,7 +113,7 @@ const sizeStyles = props => {
 };
 const StyledTrigger = styled.div.attrs({
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.6.0'
+  'data-garden-version': '9.7.0'
 }).withConfig({
   displayName: "StyledTrigger",
   componentId: "sc-116nftk-0"

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

@@ -22,7 +22,7 @@ const colorStyles = _ref => {
 };
 const StyledValue = styled.div.attrs({
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.6.0'
+  'data-garden-version': '9.7.0'
 }).withConfig({
   displayName: "StyledValue",
   componentId: "sc-t719sx-0"

package/dist/esm/views/menu/StyledFloatingMenu.js

@@ -11,7 +11,7 @@ import { StyledFloatingListbox } from '../combobox/StyledFloatingListbox.js';
 const COMPONENT_ID = 'dropdowns.menu.floating';
 const StyledFloatingMenu = styled(StyledFloatingListbox).attrs({
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.6.0'
+  'data-garden-version': '9.7.0'
 }).withConfig({
   displayName: "StyledFloatingMenu",
   componentId: "sc-1rc7ahb-0"

package/dist/esm/views/menu/StyledItem.js

@@ -11,7 +11,7 @@ import { StyledOption } from '../combobox/StyledOption.js';
 const COMPONENT_ID = 'dropdowns.menu.item';
 const StyledItem = styled(StyledOption).attrs({
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.6.0'
+  'data-garden-version': '9.7.0'
 }).withConfig({
   displayName: "StyledItem",
   componentId: "sc-1jp99dq-0"

package/dist/esm/views/menu/StyledItemAnchor.js

@@ -0,0 +1,22 @@
+/**
+* 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 styled from 'styled-components';
+import { componentStyles } from '@zendeskgarden/react-theming';
+import { StyledItemTypeIcon } from './StyledItemTypeIcon.js';
+import { StyledOption } from '../combobox/StyledOption.js';
+
+const COMPONENT_ID = 'dropdowns.menu.item_anchor';
+const StyledItemAnchor = styled(StyledOption).attrs({
+  'data-garden-id': COMPONENT_ID,
+  'data-garden-version': '9.7.0',
+  as: 'a'
+}).withConfig({
+  displayName: "StyledItemAnchor",
+  componentId: "sc-b75oa4-0"
+})(["text-decoration:none;color:unset;&[aria-current='page'] > ", "{opacity:1;}", ";"], StyledItemTypeIcon, componentStyles);
+
+export { StyledItemAnchor };

package/dist/esm/views/menu/StyledItemContent.js

@@ -11,7 +11,7 @@ import { StyledOptionContent } from '../combobox/StyledOptionContent.js';
 const COMPONENT_ID = 'dropdowns.menu.item.content';
 const StyledItemContent = styled(StyledOptionContent).attrs({
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.6.0'
+  'data-garden-version': '9.7.0'
 }).withConfig({
   displayName: "StyledItemContent",
   componentId: "sc-1opglsb-0"

package/dist/esm/views/menu/StyledItemGroup.js

@@ -11,7 +11,7 @@ import { StyledOptGroup } from '../combobox/StyledOptGroup.js';
 const COMPONENT_ID = 'dropdowns.menu.item_group';
 const StyledItemGroup = styled(StyledOptGroup).attrs({
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.6.0'
+  'data-garden-version': '9.7.0'
 }).withConfig({
   displayName: "StyledItemGroup",
   componentId: "sc-1umk3cg-0"

package/dist/esm/views/menu/StyledItemIcon.js

@@ -11,7 +11,7 @@ import { StyledOptionIcon } from '../combobox/StyledOptionIcon.js';
 const COMPONENT_ID = 'dropdowns.menu.item.icon';
 const StyledItemIcon = styled(StyledOptionIcon).attrs({
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.6.0'
+  'data-garden-version': '9.7.0'
 }).withConfig({
   displayName: "StyledItemIcon",
   componentId: "sc-w9orqb-0"

package/dist/esm/views/menu/StyledItemMeta.js

@@ -11,7 +11,7 @@ import { StyledOptionMeta } from '../combobox/StyledOptionMeta.js';
 const COMPONENT_ID = 'dropdowns.menu.item.meta';
 const StyledItemMeta = styled(StyledOptionMeta).attrs({
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.6.0'
+  'data-garden-version': '9.7.0'
 }).withConfig({
   displayName: "StyledItemMeta",
   componentId: "sc-1unw3x1-0"

package/dist/esm/views/menu/StyledItemTypeIcon.js

@@ -12,7 +12,7 @@ import { StyledItem } from './StyledItem.js';
 const COMPONENT_ID = 'dropdowns.menu.item.type_icon';
 const StyledItemTypeIcon = styled(StyledOptionTypeIcon).attrs({
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.6.0'
+  'data-garden-version': '9.7.0'
 }).withConfig({
   displayName: "StyledItemTypeIcon",
   componentId: "sc-1pll3nu-0"