diff --git a/TIPS.md b/TIPS.md index ae14882..cecf637 100644 --- a/TIPS.md +++ b/TIPS.md @@ -40,3 +40,4 @@ Going forward, new tips are pushed automatically by the `mc_survival_tips.py` cr - [Tip #45](tips/2026-09-19-045-crafting-ux-missing-item-highlight-in-recipe.md) (2026-09-19) — **crafting-ux**: Missing-item highlight in recipe - [Tip #46](tips/2026-09-20-046-crafting-ux-crafting-simulator.md) (2026-09-20) — **crafting-ux**: Crafting Simulator - [Tip #47](tips/2026-09-21-047-social-favorites-bookmarks.md) (2026-09-21) — **social**: Favorites / Bookmarks +- [Tip #48](tips/2026-09-22-048-a11y-keyboard-navigation-in-the-item-picker.md) (2026-09-22) — **a11y**: Keyboard navigation in the item-picker diff --git a/tips/2026-09-22-048-a11y-keyboard-navigation-in-the-item-picker.md b/tips/2026-09-22-048-a11y-keyboard-navigation-in-the-item-picker.md new file mode 100644 index 0000000..fb37443 --- /dev/null +++ b/tips/2026-09-22-048-a11y-keyboard-navigation-in-the-item-picker.md @@ -0,0 +1,22 @@ +--- +tip_number: 48 +date: 2026-09-22 +category: a11y +status: pending +--- + +# Tip #48 — Keyboard navigation in the item-picker + +**Date:** 2026-09-22 +**Category:** a11y +**Source:** MC-Survival Wiki Daily Tip (cron @ 18:00 MESZ) + +## Keyboard navigation in the item-picker + +Add full keyboard support to the item picker: arrow keys to move focus across the grid, Enter to select, Escape to close, type-to-search to jump to the first matching item, and proper aria-activedescendant for screen-reader announcements. It solves the mouse-only bottleneck that locks out both power users and screen-reader users, who currently cannot use the picker efficiently. The signal is a measurable share of edits and advanced searches coming from keyboard-heavy users (server-side we can see editor workflows that repeatedly open the picker). Visible focus rings are not optional — without them, the keyboard support is invisible to the user. + +## Implementation tips + +1. Arrow keys move the focus grid, Enter selects, Escape closes, type-to-search jumps to first match. +2. Visible focus rings on the focused item (not just default outline — match the theme). +3. Add aria-activedescendant to the picker container so screen readers announce the focused item.