bug:menu-button - fix duplicated menu-button id with multiple instances

[jeanpan]

This is to fix the issue when there is no id set specifically in menu-button, the id is menu-button--menu. It causes duplicated id if there are multiple menu-button instances on the page.

Before the fix

After the fix

Root cause
It's caused by the triggerId isn't updated since there is no dispatch action to update the state when the auto-id becomes valid.

---

• Use a meaningful title for the pull request. Include the name of the package modified.
• Test the change in your own code (Compile and run).
• Add or edit tests to reflect the change (Run with yarn test).
• Add or edit Storybook examples to reflect the change (Run with yarn start).
• Ensure formatting is consistent with the project's Prettier configuration.
• Add documentation to support any new features.

This pull request:

• Creates a new package
• Fixes a bug in an existing package
• Adds additional features/functionality to an existing package
• Updates documentation or example code
• Other

If creating a new package:

• Make sure the new package directory contains each of the following, and that their structure/formatting mirrors other related examples in the project:
  • examples directory
  • src directory with an index.tsx entry file
  • At least one example file per feature introduced by the new package
  • Base styles in a style.css file (if needed by the new package)

[jeanpan]

These lines got updated by running pnpm lint --fix.

[codesandbox-ci]

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Latest deployment of this branch, based on commit 91640ca:

Sandbox	Source
reach-ui-template	Configuration

[jeanpan]

@chaance, would you mind to review this change? I'd like to have author to review the change to make sure I didn't miss anything. Thank you.