primefaces / primefaces/primereact
[v11] Menu: Menu.Portal and Menu.Item with href incompatible
Nobody has claimed this yet.
- Dominant language
- CSS
- Stars
- 8.3k
- Forks
- 1.2k
- PR merge metrics
- No merged PRs in 30d
Description
Describe the bug
Description
This is a simplified version of my component:
<Menu>
<Menu.Trigger>
<span>Menu</span>
</Menu.Trigger>
<Menu.Portal>
<Menu.List>
<Menu.Item as={NextLink} href="/">
Home
</Menu.Item>
<Menu.Item as={NextLink} href="/about">
About
</Menu.Item>
</Menu.List>
</Menu.Portal>
</Menu>
When using the Menu component with Menu.Portal and Menu.Item rendered as link (as={NextLink}), clicking the menu item closes the dropdown without triggering the actual navigation to the href.
Environment
- PrimeReact: 11.0.0-alpha.9
- React: 19.2.0
- Next.js: 15.5.9
- Tailwindcss: 4.1.17
Suspected Cause
It appears the click event handler that closes the Portal is preventing the default link behavior or stopping event propagation before the NextLink can trigger its navigation. The event sequence seems to prioritize closing the Portal over following the href.
Reproducer
No response
System Information
System:
OS: Windows 11 10.0.26200
CPU: (22) x64 Intel(R) Core(TM) Ultra 7 165H
Memory: 10.30 GB / 31.46 GB
Binaries:
Node: 23.10.0 - C:\nvm4w\nodejs\node.EXE
npm: 10.9.2 - C:\nvm4w\nodejs\npm.CMD
Browsers:
Chrome: 143.0.7499.147
Edge: Chromium (140.0.3485.54)
Firefox: 141.0 - C:\Program Files\Mozilla Firefox\firefox.exe
Steps to reproduce the behavior
See code snippet
Expected behavior
No response
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with the Menu.Portal and Menu.Item entry points shown in the issue, then reproduce the provided TSX example using NextLink. Trace the click behavior when an item has an href and is rendered through Menu.Portal; done means selecting Home or About both closes the menu and performs the expected navigation.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- nextjs, react
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 45/100