Skip to content

fix(web): add keyboard access to charts#121

Merged
xingkaixin merged 1 commit into
mainfrom
feat/cs-40-keyboard-accessible-charts
Jul 11, 2026
Merged

fix(web): add keyboard access to charts#121
xingkaixin merged 1 commit into
mainfrom
feat/cs-40-keyboard-accessible-charts

Conversation

@xingkaixin

Copy link
Copy Markdown
Owner

Summary

  • make the timeline minimap scrollbar operable with Arrow, Page, Home, and End keys
  • expose Daily Activity and Daily Token bars to focus, pointer, and touch interaction
  • add accessible names and screen-reader data tables for chart buckets
  • expose model token values alongside percentages and hide the redundant pie graphic
  • add timeline, Dashboard, and Playwright accessibility coverage

Root cause

The minimap declared ARIA scrollbar semantics without keyboard behavior or a tab stop. Dashboard
bars only reacted to mouse hover and exposed details through title, leaving keyboard, touch, and
screen-reader users without an equivalent path to the data.

Impact

Every chart now has a labeled region and complete textual data equivalent. Interactive bars share
the same detail state across focus, pointer, and tap, while the timeline scrollbar implements the
standard keyboard navigation model.

Validation

  • pnpm test:e2e
  • pnpm --filter @codesesh/web test
  • pnpm lint
  • pnpm format:check
  • pnpm build
  • pnpm test

Issue: CS-40

@xingkaixin xingkaixin marked this pull request as ready for review July 11, 2026 11:25
@xingkaixin xingkaixin merged commit 7aca19f into main Jul 11, 2026
7 checks passed
@xingkaixin xingkaixin deleted the feat/cs-40-keyboard-accessible-charts branch July 11, 2026 11:27
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant