Skip to content

Conversation

Kim-Jaemin420
Copy link
Contributor

Summary

Added aria-expanded and aria-controls attributes to the side panel toggle button for better accessibility. These attributes help assistive technologies understand the current state of the panel and what action can be taken by the user.

  • aria-expanded now reflects the open/closed state of the panel (true/false)
  • aria-controls specifies the controlled nav element by its ID
  • updated aria-label using the localize function to provide a more descriptive and user-friendly name

Related #4487

Change Type

  • Improve accessibility

Testing

스크린샷 2024-10-27 오후 3 13 42 스크린샷 2024-10-27 오후 3 14 23

Checklist

  • I have performed a self-review of my own code
  • My changes do not introduce new warnings
  • Local unit tests pass with my changes

- added aria-expanded attribute to indicate the panel's expanded/collapsed state
- added aria-controls attribute to specify the element controlled by the button
- updated aria-label using the localize function for better description
@berry-13 berry-13 added the ♿ a11y Accessibility label Oct 27, 2024
@danny-avila danny-avila linked an issue Oct 28, 2024 that may be closed by this pull request
@danny-avila danny-avila changed the title a11y: improved accessibility of the side panel toggle button 🔼 a11y: Proper attributes for the side panel toggle button Oct 28, 2024
@danny-avila danny-avila merged commit 262176f into danny-avila:main Oct 28, 2024
2 checks passed
BertKiv pushed a commit to BertKiv/LibreChat that referenced this pull request Dec 10, 2024
…la#4559)

- added aria-expanded attribute to indicate the panel's expanded/collapsed state
- added aria-controls attribute to specify the element controlled by the button
- updated aria-label using the localize function for better description
MichielMAnalytics pushed a commit to MichielMAnalytics/ProAI that referenced this pull request Jun 6, 2025
…la#4559)

- added aria-expanded attribute to indicate the panel's expanded/collapsed state
- added aria-controls attribute to specify the element controlled by the button
- updated aria-label using the localize function for better description
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
♿ a11y Accessibility
Projects
None yet
Development

Successfully merging this pull request may close these issues.

side panel open/close button's state is not described
3 participants