Breadcrumbs: Fix esc button not being able to focus on the menubuttonRef (#6854)

Co-authored-by: Jon Rohan <yes@jonrohan.codes>

Author: pksjce

.changeset/ten-jobs-attack.md

@@ -0,0 +1,5 @@
+---
+"@primer/react": patch
+---
+
+Breadcrumbs: Fix esc button not being able to focus on the menubuttonRef

packages/react/src/Breadcrumbs/Breadcrumbs.tsx

@@ -9,7 +9,6 @@ import {BoxWithFallback} from '../internal/components/BoxWithFallback'
 import Details from '../Details'
 import {ActionList} from '../ActionList'
 import {IconButton} from '../Button/IconButton'
-import {Tooltip} from '../TooltipV2'
 import {KebabHorizontalIcon} from '@primer/octicons-react'
 import {useResizeObserver} from '../hooks/useResizeObserver'
 import type {ResizeObserverEntry} from '../hooks/useResizeObserver'
@@ -52,7 +51,7 @@ const BreadcrumbsMenuItem = React.forwardRef<HTMLDetailsElement, BreadcrumbsMenu
   ({items, 'aria-label': ariaLabel, ...rest}, menuRefCallback) => {
     const [isOpen, setIsOpen] = useState(false)
     const detailsRef = useRef<HTMLDetailsElement | null>(null)
-    const menuButtonRef = useRef<HTMLElement>(null)
+    const menuButtonRef = useRef<HTMLButtonElement | null>(null)
     const menuContainerRef = useRef<HTMLDivElement>(null)
     const detailsRefCallback = useCallback(
       (element: HTMLDetailsElement | null) => {
@@ -104,20 +103,19 @@ const BreadcrumbsMenuItem = React.forwardRef<HTMLDetailsElement, BreadcrumbsMenu
 
     return (
       <Details ref={detailsRefCallback} className={classes.MenuDetails}>
-        <Tooltip text={ariaLabel || `${items.length} more breadcrumb items`} direction={'e'}>
-          <IconButton
-            as="summary"
-            role="button"
-            ref={menuButtonRef}
-            aria-label={ariaLabel || `${items.length} more breadcrumb items`}
-            aria-expanded={isOpen ? 'true' : 'false'}
-            onClick={handleSummaryClick}
-            variant="invisible"
-            size="small"
-            icon={KebabHorizontalIcon}
-            {...rest}
-          />
-        </Tooltip>
+        <IconButton
+          as="summary"
+          role="button"
+          ref={menuButtonRef}
+          aria-label={ariaLabel || `${items.length} more breadcrumb items`}
+          aria-expanded={isOpen ? 'true' : 'false'}
+          onClick={handleSummaryClick}
+          variant="invisible"
+          size="small"
+          icon={KebabHorizontalIcon}
+          tooltipDirection="e"
+          {...rest}
+        />
         <div ref={menuContainerRef} className={classes.MenuOverlay}>
           <ActionList>
             {items.map((item, index) => {