make selector ignore groups

primer · Feb 12, 2024 · bcc4bcf · bcc4bcf
1 parent 0c4c3f8
commit bcc4bcf
Showing 1 changed file with 3 additions and 1 deletion.
diff --git a/packages/react/src/drafts/SelectPanel2/SelectPanel.tsx b/packages/react/src/drafts/SelectPanel2/SelectPanel.tsx
@@ -165,7 +165,9 @@ const Panel: React.FC<SelectPanelProps> = ({
 
   // used in SelectPanel.SearchInput
   const moveFocusToList = () => {
-    const firstListElement = dialogRef.current?.querySelector('ul[role=listbox] li') as HTMLLIElement | undefined
+    const selector = 'ul[role=listbox] li:not([role=none])'
+    // being specific about roles because there can be another ul (tabs in header) and an ActionList.Group (li[role=none])
+    const firstListElement = dialogRef.current?.querySelector(selector) as HTMLLIElement | undefined
     firstListElement?.focus()
   }