Fix: Accessible name mismatch for AI Chat button

[huangkevin-apr]

Summary

This PR fixes an accessibility violation on website doc page where the accessible name of the AI Chat button did not match its visible label, as reported by the IBM Equal Access Accessibility Checker.

The issue occurred because the button’s accessible name was implicitly derived from a non-string label prop (a JSX node), which resulted in an incorrect or opaque accessible name (e.g. [object Object]). This caused screen readers and a11y tools to report a mismatch between the visible label and the accessible name.

Solution

Explicitly set a string-based accessible name using the aria-label prop.

Keep the existing label prop for tooltip / visual rendering only.

<Button
  iconOnly={!showLabel || isMobile}
  size="medium"
  variant="header"
  label={
+ aria-label={t(language, 'ai_chat_ask', assistant.label)} // Explicit accessible name string
    <div className="flex items-center gap-2">
      {t(language, 'ai_chat_ask', assistant.label)}
      {withShortcut ? (

This ensures:

• The accessible name is always a plain string
• It matches the visible label text
• Screen readers and automated checkers can correctly interpret the control

Testing

The patch submitted in this PR was generated by A11YRepair, an automated Web Accessibility repair tool that I developed to address common accessibility violations in web applications. The generated fixes were manually reviewed and validated before submission.

The fix has been manually verified in the following locales:

✅ English
✅ Chinese
✅ French

[changeset-bot]

⚠️ No Changeset found

Latest commit: 5be6586

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR