Merge branch 'main' into pk/export-select-panel

Author: pksjce

.changeset/actionmenu2-aria-expanded.md

@@ -0,0 +1,5 @@
+---
+'@primer/react': patch
+---
+
+ActionMenu v2: Add aria-expanded to the ActionMenu.Button

.changeset/breezy-coats-play.md

@@ -0,0 +1,5 @@
+---
+'@primer/react': patch
+---
+
+Adds aria-hidden="true" to InputLabel required asterisk

docs/content/InputField.mdx

@@ -3,7 +3,7 @@ componentId: inputField
 title: InputField
 status: Alpha
 description: The InputField component is used to render a labelled text input and, optionally, associated validation text and hint text.
-source: https://github.com/primer/react/blob/main/src/InputField.tsx
+source: https://github.com/primer/react/blob/main/src/InputField/InputField.tsx
 storybook: '/react/storybook?path=/story/forms-inputfield--text-input-field'
 ---
 

docs/content/drafts/ActionMenu2.mdx

@@ -192,7 +192,7 @@ render(
 
 ### With External Anchor
 
-To create an anchor outside of the menu, you need to switch to controlled mode for the menu and pass it as `anchorRef` to `ActionMenu`:
+To create an anchor outside of the menu, you need to switch to controlled mode for the menu and pass it as `anchorRef` to `ActionMenu`. Make sure you add `aria-expanded` and `aria-haspopup` to the external anchor:
 
 ```javascript live noinline
 // import {ActionMenu, ActionList} from '@primer/react/drafts'
@@ -204,7 +204,7 @@ const Example = () => {
 
   return (
     <>
-      <Button ref={anchorRef} onClick={() => setOpen(!open)}>
+      <Button ref={anchorRef} aria-haspopup="true" aria-expanded={open} onClick={() => setOpen(!open)}>
         {open ? 'Close Menu' : 'Open Menu'}
       </Button>
 

src/AnchoredOverlay/AnchoredOverlay.tsx

@@ -156,6 +156,7 @@ export const AnchoredOverlay: React.FC<AnchoredOverlayProps> = ({
           id: anchorId,
           'aria-labelledby': anchorId,
           'aria-haspopup': 'true',
+          'aria-expanded': open,
           tabIndex: 0,
           onClick: onAnchorClick,
           onKeyDown: onAnchorKeyDown

src/_InputLabel.tsx

@@ -25,7 +25,7 @@ const InputLabel: React.FC<Props> = ({children, disabled, required, visuallyHidd
       {required ? (
         <Box display="flex" as="span">
           <Box mr={1}>{children}</Box>
-          <span>*</span>
+          <span aria-hidden="true">*</span>
         </Box>
       ) : (
         children

src/__tests__/__snapshots__/ActionMenu.test.tsx.snap

@@ -68,6 +68,7 @@ exports[`ActionMenu renders consistently 1`] = `
 }
 
 <button
+  aria-expanded={false}
   aria-haspopup="true"
   aria-label="menu"
   aria-labelledby="react-aria-1"

src/__tests__/__snapshots__/ActionMenu2.test.tsx.snap

@@ -80,6 +80,7 @@ exports[`ActionMenu renders consistently 1`] = `
   fontFamily="normal"
 >
   <button
+    aria-expanded={false}
     aria-haspopup="true"
     aria-labelledby="react-aria-1"
     className="c1"

src/__tests__/__snapshots__/AnchoredOverlay.test.tsx.snap

@@ -80,6 +80,7 @@ exports[`AnchoredOverlay renders consistently 1`] = `
   fontFamily="normal"
 >
   <button
+    aria-expanded={false}
     aria-haspopup="true"
     aria-labelledby="react-aria-1"
     className="c1"
@@ -193,6 +194,7 @@ exports[`AnchoredOverlay should render consistently when open 1`] = `
     font-family="normal"
   >
     <button
+      aria-expanded="true"
       aria-haspopup="true"
       aria-labelledby="react-aria-1"
       class="c1"

src/__tests__/__snapshots__/DropdownMenu.test.tsx.snap

@@ -72,6 +72,7 @@ exports[`DropdownMenu renders consistently 1`] = `
 }
 
 <button
+  aria-expanded={false}
   aria-haspopup="true"
   aria-labelledby="react-aria-1"
   className="c0"