Skip to content

feat: add aria-label and title support to Button component (#225) - #260

Merged
arisu6804 merged 2 commits into
RemitFlow:mainfrom
Hollujay:fix/225-add-aria-labels-icon-only-buttons
Jul 24, 2026
Merged

feat: add aria-label and title support to Button component (#225)#260
arisu6804 merged 2 commits into
RemitFlow:mainfrom
Hollujay:fix/225-add-aria-labels-icon-only-buttons

Conversation

@Hollujay

@Hollujay Hollujay commented Jul 21, 2026

Copy link
Copy Markdown
Contributor

Summary

Adds aria-label and title prop support to the reusable Button component, enabling accessible icon-only buttons. All existing icon-only buttons in the codebase already had explicit aria-label attributes, but the Button component itself did not forward these props to the underlying <button> element.

Changes

src/components/Button.jsx

  • Added ariaLabel and title props that are passed through to the <button> element
  • Updated JSDoc with the new prop documentation

src/components/Button.stories.jsx

  • Added IconOnly story demonstrating usage with an icon (✕) and ariaLabel/title
  • Added ariaLabel and title to Storybook argTypes

test/unit/Button.test.jsx (new)

  • Renders children as text content
  • Calls onClick when clicked
  • Does not call onClick when disabled
  • Applies a custom aria-label for icon-only buttons
  • Applies a custom title attribute
  • Sets the type attribute

Closes #225

@arisu6804

Copy link
Copy Markdown
Contributor

Looks great, thanks for the careful work! 🙌

@arisu6804

Copy link
Copy Markdown
Contributor

Solid, merging! ✨

@arisu6804
arisu6804 merged commit 6e7786b into RemitFlow:main Jul 24, 2026
1 check failed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Add aria-labels to icon-only buttons

2 participants