fix(menu): prevents defaultFocusedValue from focusing items on trigger click (#660)

Author: geotrev

packages/menu/src/MenuContainer.spec.tsx

@@ -280,6 +280,20 @@ describe('MenuContainer', () => {
           expect(firstItem).toHaveFocus();
         });
 
+        it('does not focus default value on click', async () => {
+          const { getByTestId, getByText } = render(
+            <TestMenu items={ITEMS} defaultFocusedValue="plant-04" />
+          );
+          const trigger = getByTestId('trigger');
+          const item = getByText('Succulent');
+
+          await act(async () => {
+            await user.click(trigger);
+          });
+
+          expect(item).not.toHaveFocus();
+        });
+
         it('focuses defaultFocusedValue on ArrowDown keydown', async () => {
           const { getByText, getByTestId } = render(
             <TestMenu items={ITEMS} defaultFocusedValue="plant-04" />

packages/menu/src/useMenu.ts

@@ -97,7 +97,7 @@ export const useMenu = <T extends HTMLElement = HTMLElement, M extends HTMLEleme
   const focusTriggerRef = useRef<boolean>(false);
 
   const [state, dispatch] = useReducer(stateReducer, {
-    focusedValue: focusedValue || defaultFocusedValue,
+    focusedValue,
     isExpanded: isExpanded || defaultExpanded,
     selectedItems: initialSelectedItems,
     valuesRef: values,