LibreChat/client
Danny Avila 44dbbd5328
a11y: Hide Collapsed Thinking Content From Screen Readers (#11927)
* fix(a11y): hide collapsed thinking content from screen readers and link toggle to controlled region

The thinking/reasoning toggle button visually collapsed content using a CSS
grid animation (gridTemplateRows: 0fr + overflow-hidden), but the content
remained in the DOM and fully accessible to screen readers, cluttering the
reading flow for assistive technology users.

- Add aria-hidden={!isExpanded} to the collapsible content region in both
  the legacy Thinking component and the modern Reasoning component, so
  screen readers skip collapsed thoughts entirely
- Add role="region" and a unique id (via useId) to each collapsible content
  div, giving it a semantic landmark for assistive technology
- Add contentId prop to the shared ThinkingButton and wire it to
  aria-controls on the toggle button, establishing an explicit relationship
  between the button and the region it expands/collapses
- aria-expanded was already present on the button; combined with
  aria-controls, screen readers can now fully convey the toggle state and
  its target

* fix(a11y): add aria-label to collapsible content regions in Thinking and Reasoning components

Enhanced accessibility by adding aria-label attributes to the collapsible content regions in both the Thinking and Reasoning components. This change ensures that screen readers can provide better context for users navigating through the content.

* fix(a11y): update roles and aria attributes in Thinking and Reasoning components

Changed role from "region" to "group" for collapsible content areas in both Thinking and Reasoning components to better align with ARIA practices. Updated aria-hidden to handle undefined values correctly and ensured contentId is passed to relevant components for improved accessibility and screen reader support.
2026-02-24 20:59:56 -05:00
..
public 🎭 chore: Padding to Maskable Icon for Android adaptive icons (#11626) 2026-02-04 15:51:51 +01:00
scripts 🔧 refactor: Build Process and Static Asset Handling (#7605) 2025-05-28 11:48:04 -04:00
src a11y: Hide Collapsed Thinking Content From Screen Readers (#11927) 2026-02-24 20:59:56 -05:00
test 🔐 feat: Granular Role-based Permissions + Entra ID Group Discovery (#7804) 2025-08-13 16:24:17 -04:00
babel.config.cjs chore: Remove Unused Dependencies 🧹 (#939) 2023-09-14 15:12:22 -04:00
check_updates.sh 🔧 fix: Resolve Proper Dependencies to fix Application Error (#2488) 2024-04-22 12:52:30 -04:00
index.html 🌐 feat: Add support to SubDirectory hosting (#9155) 2025-08-27 02:00:18 -04:00
jest.config.cjs v0.8.3-rc1 (#11856) 2026-02-18 20:36:03 -05:00
nginx.conf 🚅 chore: Added an Example of Nginx gzip Settings (#3173) 2024-06-23 13:49:00 -04:00
package.json v0.8.3-rc1 (#11856) 2026-02-18 20:36:03 -05:00
postcss.config.cjs refactor: Settings/Presets UI Restructure, convert many files to TS (#740) 2023-08-04 13:56:44 -04:00
tailwind.config.cjs style(MCP): Enhance dialog accessibility and styling consistency (#11585) 2026-02-11 22:08:40 -05:00
tsconfig.json 🖼️ style: Improve Marketplace & Sharing Dialog UI 2025-08-13 16:24:24 -04:00
vite.config.ts 📊 feat: Render Inline Mermaid Diagrams (#11112) 2025-12-26 19:53:06 -05:00