refactor(dashboard): add Heatmap tooltip accessibility — keyboard support

[JhaSourav07]

🧩 Background

components/dashboard/Heatmap.tsx shows tooltips on mouseenter/mouseleave events only. Keyboard-only and touch users cannot see contribution details for individual days.

🎯 Objective

Add onFocus/onBlur handlers to the heatmap cells so tooltips appear on keyboard focus.

📁 Files to touch

• components/dashboard/Heatmap.tsx

🛠️ Implementation steps

• Add tabIndex={0} and role="gridcell" to each day cell.
• Attach onFocus → show tooltip, onBlur → hide tooltip.
• Add aria-label with the contribution count string.

✅ Definition of done

• Cells are keyboard-focusable.
• Tooltip appears on focus.
• aria-label is set.
• No regressions in existing tests.

[nivedha2025cse-gif]

hi @JhaSourav07 please assign this to me

[AishwaryJhunjhunwala]

Hi @JhaSourav07 ,
I’d like to work on this issue under GSSoC 2026.

Plan:

• Add tabIndex={0} and role="gridcell" to heatmap day cells
• Implement onFocus and onBlur handlers to show/hide tooltips for keyboard users
• Add descriptive aria-label values with contribution count details
• Verify keyboard accessibility works without affecting existing behavior or tests

Can you please assign this issue to me?

[palakdeep316]

Hey @JhaSourav07 ,

I’d like to work on this issue under GSSoC 2026.

I understood that the heatmap tooltips currently work only with mouse events, so I can improve accessibility by adding proper keyboard focus support using onFocus / onBlur, along with tabIndex, role="gridcell", and meaningful aria-labels for each contribution cell.

I’ll make sure the existing behavior remains unchanged and there are no regressions.

Please assign this issue to me.

[Rk-creations-dev]

Hey @JhaSourav07
Please assign this issue to me under Gssoc26 ,
i would truly like to work on this issue as my first contribution.

[Amitverma0509]

/claim