Frontend: Tabs with Arrow-Key Navigation

MediumTypeScript

Description

> This problem is paper-only - see explanation for the canonical React solution. A WAI-ARIA Tabs widget supports arrow-key navigation between tab triggers. Left/Up moves to the previous tab; Right/Down moves to the next; Home jumps to first; End jumps to last. Wrapping is required. **For the auto-grader:** implement `tabKeyboardHandler(currentIndex, key, tabCount)` returning the next index, or `-1` if the key isn't a navigation key.

Example 1

Input: currentIndex = 0, key = "ArrowRight", tabCount = 3

Output: 1

Example 2

Input: currentIndex = 2, key = "ArrowRight", tabCount = 3

Output: 0

Example 3

Input: currentIndex = 1, key = "Home", tabCount = 3

Output: 0

Example 4

Input: currentIndex = 1, key = "End", tabCount = 3

Output: 2

Example 5

Input: currentIndex = 0, key = "Enter", tabCount = 3

Output: -1

Constraints

- key is one of: "ArrowLeft", "ArrowRight", "ArrowUp", "ArrowDown", "Home", "End", or anything else (return -1). - tabCount >= 1 - 0 <= currentIndex < tabCount

Loading editor...