Tabs Block with Keyboard Navigation

[widoz]

Context

Create accessible tabs component following ARIA tabs pattern with full keyboard navigation.

Requirements

• Create /sources/Blocks/Tabs/:
  • Block supports nested InnerBlocks for tab panels
  • Tab list with aria-role="tablist"
  • Tab buttons with aria-role="tab"
  • Tab panels with aria-role="tabpanel"
  • Keyboard navigation: Arrow keys, Home, End
• Variants: default, underline, pills

Implementation Notes

• Use InnerBlocks for flexible tab content
• Implement ARIA tabs pattern fully
• Arrow keys navigate between tabs
• Enter/Space activates tab
• Home/End jump to first/last tab
• Style variants using block supports or variation API
• Reference: https://www.w3.org/WAI/ARIA/apg/patterns/tabs/

Acceptance Criteria

• Block with multiple tabs insertable
• Full ARIA implementation (tablist, tab, tabpanel)
• Keyboard navigation works (arrows, home, end)
• Only one tab visible at a time
• Selected tab visually indicated
• 3 style variants available
• Accessible to screen readers

Dependencies

• Project Foundation & Build Setup #1 (needs build system)