feat(action-popover): allow menu button to be focused programmatically

[nuria1110]

fix #5589

Proposed behaviour

Expose focusButton method to programmatically focus on the menu button using ref.

Current behaviour

ActionPopover menu button cannot be focused programmatically.

Checklist

• Commits follow our style guide
• Related issues linked in commit messages if required
• Screenshots are included in the PR if useful
• All themes are supported if required
• Unit tests added or updated if required
• Playwright automation tests added or updated if required
• Storybook added or updated if required
• Translations added or updated (including creating or amending translation keys table in storybook) if required
• Typescript d.ts file added or updated if required
• Related docs have been updated if required

QA

• Tested in provided StackBlitz sandbox/Storybook
• Add new Playwright test coverage if required
• Carbon implementation matches Design System/designs
• UI Tests GitHub check reviewed if required

Additional context

Testing instructions

[damienrobson-sage]

One minor suggestion (more from a cleanliness perspective) but works great 👍

[damienrobson-sage]

suggestion (non-blocking): Feels like this can be better written to remove some of the duplicated lines (just for neatness and readability, though - it's functionally fine). Something like this (via Co-Pilot):

const onButtonKeyDown = useCallback(
  (e) => {
    if (
      Events.isSpaceKey(e) ||
      Events.isDownKey(e) ||
      Events.isEnterKey(e) ||
      Events.isUpKey(e)
    ) {
      e.preventDefault();
      e.stopPropagation();
      setFocusIndex(
        Events.isUpKey(e) ? lastFocusableItem : firstFocusableItem
      );
      setOpen(true);
    }
  },
  [firstFocusableItem, lastFocusableItem, setOpen],
);

[damienrobson-sage]

Also, a re-read indicates the original code was already there and this "change" was just because it moved, so feel free to completely ignore this 😄

[nuria1110]

Will add this in for some cleanliness