Menu: Fix typeahead with leading visuals (#1914)

* Trim textContent to ignore leading visual * Create slimy-garlics-wash.md * Menu → ActionMenu
primer · Mar 2, 2022 · b651d70 · b651d70
1 parent 0256a5f
commit b651d70
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 1 deletion.
diff --git a/.changeset/slimy-garlics-wash.md b/.changeset/slimy-garlics-wash.md
@@ -0,0 +1,5 @@
+---
+"@primer/react": patch
+---
+
+ActionMenu: Fix typeahead with leading visuals
diff --git a/src/hooks/useTypeaheadFocus.ts b/src/hooks/useTypeaheadFocus.ts
@@ -49,7 +49,7 @@ export const useTypeaheadFocus = (open: boolean, providedRef?: React.RefObject<H
 
       const focusNextMatch = () => {
         const itemsStartingWithKey = focusableItems.filter(item => {
-          return item.textContent?.toLowerCase().startsWith(query)
+          return item.textContent?.toLowerCase().trim().startsWith(query)
         })
 
         const currentActiveIndex = itemsStartingWithKey.indexOf(activeElement)