Audit React components for accessibility (a11y) issues across four dimensions: ARIA attributes, keyboard navigation, color contrast, and screen reader compatibility. Produces concrete fix suggestions with before/after code comparisons. Use when user asks to "check accessibility", "audit a11y", "fix ARIA", "keyboard navigation issues", "screen reader support", "color contrast check", "WCAG compliance", or "make component accessible". Do NOT use for native mobile accessibility (iOS VoiceOver / Android TalkBack) or PDF accessibility — those require platform-specific tooling.
Detect and fix accessibility violations in React components so that users with disabilities — including those who rely on screen readers, keyboard-only navigation, or high-contrast modes — can use the application effectively.
All guidance targets WCAG 2.1 AA compliance unless the user requests AAA.
Determine which files to audit:
*.tsx and *.jsx files under src/.Inspect every component against the four dimensions below. For each violation found,