react-diff-view icon indicating copy to clipboard operation
react-diff-view copied to clipboard

Accessibility: Add screenreader-only text to table cells for status indicators

Open fscholdei opened this issue 4 months ago • 1 comments

First, thank you for this fantastic component library! It's easy to use and obviously well-maintained.

I've noticed that the "insert" and "delete" statuses are currently represented solely by color. While this is visually effective, it creates a significant accessibility barrier for users who are colorblind or rely on screen readers.

To improve accessibility, I'd like to suggest adding a element within the table cell that also indicates the row number, which would be visible only to screen readers and would add a text-based status. This would contain a text description, such as "added" or "deleted," that a screen reader could announce, providing an alternative to the color-based visual cue.

Thank you for your consideration and for all the hard work you put into this project!

fscholdei avatar Sep 22 '25 13:09 fscholdei