Anchor tag hyperlink to page fragments not working on Drawer (Vaul)

[subhranshudas]

Guys/Gals,

Following is my setup

• Next JS - 14
• UI lib - https://ui.shadcn.com/docs/components/drawer (from vaul)

I have a responsive navbar, on desktop sizes show the navlinks in the middle, and on smaller/mobile sizes show them on the drawer when clicked on the hamburger menu icon.

Now my navlinks when clicked takes the user to a fragment on the same page. ( with #fragmentID)

The issue I am facing is In the Mobile Nav Drawer, I am wrapping the "a" tag with DrawerClose to trigger a close. When i click on a link the Drawer closes but the hyperlink section is not getting scrolled to.

I feel the hyperlink click event is somehow getting hijacked by Vaul Drawer. This issue doesn't happen in https://ui.shadcn.com/docs/components/sheet

Any help is appreciated!

Regards.