Improve feature library modal search a11y and key navigation

Anas Shahidrequested to merge
608787-feature-library-modal-a11y-polish into master

What does this MR do and why?

Implements both follow-ups from the review of !248621 (merged), tracked in #608787 (closed):

  1. ArrowDown moves focus into search results. Enter was the only key that focused the first result, and nothing taught it. ArrowDown is now bound to the same handler, matching the key used for this elsewhere (modal_keyboard_navigation_mixin.js, file_tree_search.vue), and the search input gets an sr-only aria-describedby hint teaching both keys (same pattern as global_search.vue). The handler only calls preventDefault() after its guards pass, so with no query or no results both keys keep their default behavior.
  2. Counted Gemini success announcement. The live region announced the same "Gemini found matching features." for 1 or 20 results. It now announces a pluralized count via n__: "Gemini found 3 matching features.", mirroring the sibling global search searchResultsDescription.

No changelog: the modal is behind the default-off feature_library_modal feature flag.

References

Screenshots or screen recordings

The caption bar at the bottom of each recording mirrors two things that are otherwise invisible: the sr-only Gemini status live region, and the text of the search input's aria-describedby hint. The keystroke pill in the top-right shows the key being pressed.

Before After
feature-library-a11y-before feature-library-a11y-after

In the recordings: ArrowDown after searching "board" leaves focus in the input (before) vs. moves focus to the first result tile (after); the Gemini search on a no-match query announces "Gemini found matching features." (before) vs. "Gemini found 3 matching features." (after).

Recording environment notes: the ai_search endpoint response was stubbed at the browser level (GDK has no AI gateway), and the Gemini button was enabled locally via feature_discovery_gemini_search plus an active trial. Everything else is live GDK behavior.

How to set up and validate locally

  1. Feature.enable(:feature_library_modal)
  2. On a project page, press </kbd> (or select More features in the sidebar) to open the modal.
  3. Type a query with results and press ArrowDown (or Enter): focus moves to the first result tile. With an empty query, both keys do nothing and keep their default input behavior.
  4. With a screen reader, focus the search input: the hint "Press Enter or the down arrow key to move to the first search result." is read after the placeholder. A successful Gemini search announces the result count.

Merge request reports