fix(DropdownMenu): a disabled trigger never opens the menu

.changeset/dropdownmenu-disabled-trigger.md

@@ -0,0 +1,7 @@
+---
+'@astryxdesign/core': patch
+---
+
+[fix] `DropdownMenu` and `MoreMenu`: a disabled trigger no longer opens the menu. A disabled trigger with a tooltip stays focusable (`aria-disabled`), and Button swallowed only Enter and Space, so ArrowDown, ArrowUp, a press, or a click could still open the anchored menu; the anchored open path and the bottom-sheet trigger's click now check the trigger's availability first, for the default Button and for a natively or `aria-disabled` custom trigger.
+
+@cixzhang

packages/core/src/DropdownMenu/DropdownMenu.test.tsx

@@ -2861,6 +2861,31 @@ describe('DropdownMenu custom trigger', () => {
     );
   });
 
+  it('a disabled custom trigger never opens the menu', async () => {
+    const user = userEvent.setup();
+    render(
+      <DropdownMenu
+        items={[{label: 'Edit'}, {label: 'Delete'}]}
+        renderTrigger={({ref, ...props}) => (
+          <button type="button" ref={ref} aria-disabled="true" {...props}>
+            Row actions
+          </button>
+        )}
+      />,
+    );
+    const trigger = screen.getByRole('button', {name: 'Row actions'});
+    trigger.focus();
+    await user.keyboard('{ArrowDown}');
+    expect(trigger).toHaveAttribute('aria-expanded', 'false');
+    await user.pointer([
+      {keys: '[MouseLeft>]', target: trigger},
+      {keys: '[/MouseLeft]'},
+    ]);
+    expect(trigger).toHaveAttribute('aria-expanded', 'false');
+    await user.click(trigger);
+    expect(trigger).toHaveAttribute('aria-expanded', 'false');
+  });
+
   it('a custom trigger opens from the keyboard and lands on the first row', async () => {
     const user = userEvent.setup();
     render(

packages/core/src/DropdownMenu/DropdownMenu.tsx

@@ -716,7 +716,15 @@ function DropdownMenuBottomSheet({
       openModalityRef.current = 'keyboard';
     }
   };
-  const handleSheetTriggerClick = () => {
+  const handleSheetTriggerClick = (event: React.MouseEvent<HTMLElement>) => {
+    // A caller-rendered trigger that is natively or aria-disabled must not
+    // open the sheet; the default Button already refuses its own click.
+    if (
+      event.currentTarget.matches(':disabled, [aria-disabled="true"]') ||
+      button.isDisabled === true
+    ) {
+      return;
+    }
     onClick?.();
     setOpen(!isOpen);
   };
@@ -1190,6 +1198,16 @@ function DropdownMenuPopover({
       modality: 'keyboard' | 'pointer' = 'keyboard',
       notifyClick = false,
     ): boolean => {
+      // An unavailable trigger never opens the menu. Button keeps an
+      // aria-disabled trigger focusable for its tooltip and swallows only
+      // Enter and Space, so the arrow keys, a press and a click would still
+      // arrive here; a custom trigger may be natively disabled instead.
+      if (
+        button.isDisabled === true ||
+        buttonRef.current?.matches(':disabled, [aria-disabled="true"]') === true
+      ) {
+        return false;
+      }
       acceptedOpenRef.current = false;
       notifyClickOnShowRef.current = notifyClick;
       pendingControlledOpenRef.current = isControlled;
@@ -1205,7 +1223,7 @@ function DropdownMenuPopover({
       }
       return true;
     },
-    [isControlled, popover],
+    [button.isDisabled, isControlled, popover],
   );
 
   const isMenuOpenNow = isControlled
@@ -1328,7 +1346,11 @@ function DropdownMenuPopover({
             return;
           }
           focusLastOnOpenRef.current = e.key === 'ArrowUp';
-          openAndFocus();
+          if (!openAndFocus()) {
+            // A refused open (disabled trigger) must not leave ArrowUp's
+            // "land on the last row" armed for a later open.
+            focusLastOnOpenRef.current = false;
+          }
         }
         return;
       }

packages/core/src/MoreMenu/MoreMenu.test.tsx

@@ -159,6 +159,44 @@ describe('MoreMenu', () => {
     expect(button).toHaveAttribute('aria-disabled', 'true');
   });
 
+  it('keeps the menu closed from every opening key and press while disabled', async () => {
+    const user = userEvent.setup();
+    render(<MoreMenu items={defaultItems} isDisabled />);
+    const button = screen.getByRole('button', {name: 'More options'});
+    button.focus();
+    for (const key of ['{Enter}', ' ', '{ArrowDown}', '{ArrowUp}']) {
+      await user.keyboard(key);
+      expect(button).toHaveAttribute('aria-expanded', 'false');
+    }
+    await user.pointer([
+      {keys: '[MouseLeft>]', target: button},
+      {keys: '[/MouseLeft]'},
+    ]);
+    expect(button).toHaveAttribute('aria-expanded', 'false');
+  });
+
+  it('does not carry a refused ArrowUp into a later open', async () => {
+    const user = userEvent.setup();
+    const {rerender} = render(<MoreMenu items={defaultItems} isDisabled />);
+    const button = screen.getByRole('button', {name: 'More options'});
+    button.focus();
+    await user.keyboard('{ArrowUp}');
+    expect(button).toHaveAttribute('aria-expanded', 'false');
+
+    // Enabled again, a synthesized click (detail 0: screen-reader activation)
+    // opens on the FIRST row; the refused ArrowUp must not have armed "last".
+    rerender(<MoreMenu items={defaultItems} />);
+    fireEvent.click(button, {detail: 0});
+    await waitFor(() => {
+      expect(button).toHaveAttribute('aria-expanded', 'true');
+    });
+    await waitFor(() => {
+      expect(
+        screen.getByRole('menuitem', {name: 'Edit', hidden: true}),
+      ).toHaveFocus();
+    });
+  });
+
   it('supports custom label', () => {
     render(<MoreMenu items={defaultItems} label="Row actions" />);
     expect(