Skip to content

feat(core): useTypeahead hook + DropdownMenu integration (menus-11)#3431

Merged
cixzhang merged 2 commits into
mainfrom
navi/feat/use-typeahead
Jul 2, 2026
Merged

feat(core): useTypeahead hook + DropdownMenu integration (menus-11)#3431
cixzhang merged 2 commits into
mainfrom
navi/feat/use-typeahead

Conversation

@cixzhang

@cixzhang cixzhang commented Jul 2, 2026

Copy link
Copy Markdown
Contributor

Part of the accessibility & keyboard-management program (#3343). Adds the typeahead primitive the audit calls for (infra-14) and closes menus-11 for DropdownMenu.

What this adds

useTypeahead — a first-character ("type-to-focus") search hook:

  • Buffers printable keystrokes and resets after 750ms of inactivity.
  • Matches items whose label starts with the buffer; cycles from the current index, so pressing the same letter repeatedly walks through matches (astryx's Selector typeahead restarted at 0 and stuck on the first match).
  • Skips disabled indices; reserves a bare Space for activation (only extends the query mid-buffer).
  • Additive and collection-agnostic — it doesn't move focus itself; the caller wires onMatch to its own focus/selection (e.g. useListFocus.focusItem). No change to useListFocus/useGridFocus, so it's independent of the roving-engine consolidation discussion.

Wired into DropdownMenu

DropdownMenu's key handler now runs typeahead before arrow navigation — typing a letter jumps to the matching menu item. Menus previously had no typeahead (an APG Menu requirement).

Tests

useTypeahead.test.tsx (7): match, buffer accumulation, same-letter cycling + wrap, timeout reset, disabled-skip, control/modifier ignore, bare-Space ignore. DropdownMenu.test.tsx (+1): typing focuses the matching item. Full suites green (39 tests), typecheck + lint clean.

Follow-up

Wire useTypeahead into ContextMenu/NavMenu/MoreMenu (same listKeyDown seam) and the Selector family (replace its restart-at-0 matcher) — deferred to focused follow-ups.

@vercel

vercel Bot commented Jul 2, 2026

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
astryx Ready Ready Preview, Comment Jul 2, 2026 6:49pm

Request Review

@meta-cla meta-cla Bot added the CLA Signed This label is managed by the Meta Open Source bot. label Jul 2, 2026
@github-actions

github-actions Bot commented Jul 2, 2026

Copy link
Copy Markdown
Contributor

PR Analysis Report

📚 Storybook Preview

View Storybook for this PR
GitHub Pages may take up to a minute to hydrate after deploy.

🧪 Sandbox Preview

View Sandbox for this PR
GitHub Pages may take up to a minute to hydrate after deploy.

No new or modified components detected.

Bundle Size Summary

Package Size (ESM) Size (CJS) Gzipped
@astryxdesign/core N/A 4.6KB 0B

Accessibility Audit

Status: No accessibility violations detected.


Generated by PR Enrichment workflow | Storybook | Sandbox | View full report

@cixzhang cixzhang marked this pull request as ready for review July 2, 2026 18:22
@cixzhang cixzhang enabled auto-merge (squash) July 2, 2026 18:22
@cixzhang

cixzhang commented Jul 2, 2026

Copy link
Copy Markdown
Contributor Author

fix conflicts

@cixzhang cixzhang force-pushed the navi/feat/use-typeahead branch from d50cb73 to ddcb354 Compare July 2, 2026 18:45
@cixzhang cixzhang merged commit c891bf8 into main Jul 2, 2026
15 checks passed
github-actions Bot added a commit that referenced this pull request Jul 2, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

CLA Signed This label is managed by the Meta Open Source bot.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants