feat(Button): add support for aria-current prop (#7643)

adobe · Jan 22, 2025 · 7b7b461 · 7b7b461 · rspbot · Jan 22, 2025
1 parent 9bb6ed9
commit 7b7b461
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 0 deletions.
diff --git a/packages/@react-aria/button/src/useButton.ts b/packages/@react-aria/button/src/useButton.ts
@@ -107,6 +107,7 @@ export function useButton(props: AriaButtonOptions<ElementType>, ref: RefObject<
       'aria-expanded': props['aria-expanded'],
       'aria-controls': props['aria-controls'],
       'aria-pressed': props['aria-pressed'],
+      'aria-current': props['aria-current'],
       onClick: (e) => {
         if (deprecatedOnClick) {
           deprecatedOnClick(e);

diff --git a/packages/@react-types/button/src/index.d.ts b/packages/@react-types/button/src/index.d.ts
@@ -55,6 +55,8 @@ interface AriaBaseButtonProps extends FocusableDOMProps, AriaLabelingProps {
   'aria-controls'?: string,
   /** Indicates the current "pressed" state of toggle buttons. */
   'aria-pressed'?: boolean | 'true' | 'false' | 'mixed',
+  /** Indicates whether this element represents the current item within a container or set of related elements. */
+  'aria-current'?: boolean | 'true' | 'false' | 'page' | 'step' | 'location' | 'date' | 'time',
   /**
    * The behavior of the button when used in an HTML form.
    * @default 'button'

diff --git a/packages/react-aria-components/test/Button.test.js b/packages/react-aria-components/test/Button.test.js
@@ -51,6 +51,12 @@ describe('Button', () => {
     expect(button).toHaveAttribute('formMethod', 'post');
   });
 
+  it('should support accessibility props', () => {
+    let {getByRole} = render(<Button aria-current="page">Test</Button>);
+    let button = getByRole('button');
+    expect(button).toHaveAttribute('aria-current', 'page');
+  });
+
   it('should support slot', () => {
     let {getByRole} = render(
       <ButtonContext.Provider value={{slots: {test: {'aria-label': 'test'}}}}>