feat(charts): Improve accessibility with keyboard interaction

[akashsonune]

• Traverse legend items with arrow keys (custom legend only)
• Select/Unselect legend item with Enter/space
• Tab to move to charts view with tooltip opened
• Traverse through each data point with arrow keys
• Escape to close tooltip
• Use Shift +/- Shift arrows home to operate zoom slider

---

Documentation.
Examples.
Dashboards Demo.
Playwright report.

Coverage Reports:

• charts-ng
• dashboards-ng
• element-ng
• element-translate-ng
• maps-ng
• native-charts-ng

[gemini-code-assist]

Code Review

This pull request implements accessibility features for charts, including keyboard navigation for data points, zoom sliders, and legends, as well as ARIA support and live announcements. The review feedback identifies several TypeScript style guide violations regarding the use of the any type and suggests improvements for ARIA label redundancy and legend navigation logic.

[dr-itz]

Focus is barely visible, needs to be in our focus color. Why not just have the focus border around the whole element?

[akashsonune]

Focus is barely visible, needs to be in our focus color. Why not just have the focus border around the whole element?

done. Not sure about focusing the whole element, I see that the other libs like carbon focus just the legend icon. Maybe we can discuss this along with ux

[github-actions]

⬇️ Download VRTs

[akashsonune]

@dr-itz can you take a look

[akashsonune]

@dr-itz can you review

[dr-itz]

Examples aren't live any more, so I cannot test. Also, please squash the commits

[akashsonune]

@dr-itz I think you should see the examples now. please check

[akashsonune]

@dr-itz Ping

[spike-rabbit]

Is there a reason why we build this ourself? Seems like echarts has some aria modules: https://echarts.apache.org/handbook/en/best-practices/aria

[akashsonune]

Is there a reason why we build this ourself? Seems like echarts has some aria modules: https://echarts.apache.org/handbook/en/best-practices/aria

@spike-rabbit The echarts aria modules have some limitations, I had listed the observation under #1973 and the related PR for echarts aria modules- #1735

The echarts aria modules mainly help in third case of charts usage i.e. iterating through all raw data

But since there is no way to pause/stop this, also can be very long text, it is not very useful.

I had a discussion with accessibility team along with @panch1739 and we decided to cover this third case later. There, we can also revisit the echarts aria module and other options to read the raw series data.