Context
src/components/metagraphed/charts/sparkline.tsx:111-166 attaches onPointerMove/onPointerLeave to the wrapping <div> to drive a per-point value tooltip. There is no onFocus/onKeyDown/tabIndex handling to let keyboard users step through points and see the same per-point readout — keyboard-only users get just the single static aria-label summary on the <svg> (e.g. "Stake Gini"), never the point-by-point value/date detail mouse users see on hover. This sparkline component is reused broadly: concentration-panel.tsx, subnet-history-chart.tsx, neuron-history-chart.tsx, and more.
Requirement
Keyboard users must be able to reach the same per-point value/date detail that pointer users get via hover, on every chart using this shared sparkline component.
Deliverable
- File to change:
src/components/metagraphed/charts/sparkline.tsx:111-166.
- What "done" looks like concretely: make the sparkline wrapper focusable (
tabIndex={0}), add keyboard handling (e.g. arrow-key stepping between points once focused) that drives the same tooltip-reveal logic currently triggered by onPointerMove, and ensure the currently-focused point's value/date is exposed via an aria-live region or updated aria-valuenow-style attribute so screen readers announce it as the user steps through.
Acceptance criteria
Non-goals
- Don't change the sparkline's visual rendering or the chart library/approach it uses.
- Don't add new chart types or data — this is an interaction-accessibility fix for the existing component.
Size
Size: M — keep this PR small (aim for ≤10 files / ≤1000 LOC).
Part of #2542.
Context
src/components/metagraphed/charts/sparkline.tsx:111-166attachesonPointerMove/onPointerLeaveto the wrapping<div>to drive a per-point value tooltip. There is noonFocus/onKeyDown/tabIndexhandling to let keyboard users step through points and see the same per-point readout — keyboard-only users get just the single staticaria-labelsummary on the<svg>(e.g. "Stake Gini"), never the point-by-point value/date detail mouse users see on hover. This sparkline component is reused broadly:concentration-panel.tsx,subnet-history-chart.tsx,neuron-history-chart.tsx, and more.Requirement
Keyboard users must be able to reach the same per-point value/date detail that pointer users get via hover, on every chart using this shared sparkline component.
Deliverable
src/components/metagraphed/charts/sparkline.tsx:111-166.tabIndex={0}), add keyboard handling (e.g. arrow-key stepping between points once focused) that drives the same tooltip-reveal logic currently triggered byonPointerMove, and ensure the currently-focused point's value/date is exposed via anaria-liveregion or updatedaria-valuenow-style attribute so screen readers announce it as the user steps through.Acceptance criteria
sparkline.tsxappears in the diffconcentration-panel.tsxandsubnet-history-chart.tsx), not just in isolationNon-goals
Size
Size: M — keep this PR small (aim for ≤10 files / ≤1000 LOC).
Part of #2542.