[Feature Request]: Support the ability to make the MenuItem component a clickable link

[AbrahamLara]

The problem

I am implementing a feature for a chat bot that allows developers to add custom elements to the chat header. The custom elements are a link, menu (w/submenus), and buttons.

Even if the web chat is a larger size, there is only so much you can fit into the chat header. This is where the Menu component is useful for a developer who wants to fit more elements in the chat header that can't all be displayed at once.

The problem at the moment is that developers will be able to add Menus with custom buttons and submenus that can't fit in the header, but they won't be able to add links to menus because the MenuItem component doesn't support anchor element attributes as props (href, target, etc.).

The solution

I would like for the MenuItem component to support anchor element attributes so that it can be a link in order to help complete the feature I'm working on.

Examples

• OverflowMenuItem component props

Application/PAL

No response

Business priority

Medium Priority = upcoming release but is not pressing

Available extra resources

No response

Code of Conduct

• I agree to follow this project's Code of Conduct

[github-actions]

Thank you for submitting a feature request. Your proposal is open and will soon be triaged by the Carbon team.

If your proposal is accepted and the Carbon team has bandwidth they will take on the issue, or else request you or other volunteers from the community to work on this issue.

[alina-jacob]

Adding the relevant Slack thread 1 and thread 2, shared by Taylor for context!

[adamalston]

I think I'm encountering the same issue as the issue author except I can define an href. I just can't add target or rel attributes without getting errors since they aren't typed. If I ignore the errors, the attributes work fine.

Reproduction for the target and rel issues: https://stackblitz.com/edit/github-9smbll?file=src%2FApp.tsx. I think just adding types will resolve the issue since there's already a rest parameter in the code:

carbon/packages/react/src/components/OverflowMenuItem/OverflowMenuItem.tsx

Line 184 in c52884c

{...rest}>

[aagonzales]

Summary from the Slack threads: Yes, this is an enhancement we want to add.