[BUG] - HeroUI not working when using in an npm package

[szbphoto]

HeroUI Version

2.7.2

Describe the bug

I just created an npm package to add the frequiently used components like, auth modal, buttons and etc.
So i Tried to add HeroUI provider inside the next project and also tried to add inside the npm package but the modals, dropdown adn other components not working, not opening.

But if i add a modal inside the next project it works fine but in the npm package it does not open.

Now I cannot create an npm package for the most used components.

Your Example Website or App

No response

Steps to Reproduce the Bug or Issue

1. Create an npm package
2. Add a modal that opens instantly
3. add it to your project

Expected behavior

I want to use heroui components in an npm package and work just how i want it to work.

Screenshots or Videos

You can see the modal is there, but not displaying, tried z index and everything but it does not open, but if i add a modal inside the nextjs project that isOpen then the modal which is inside my npm package also open, but without that it will not.

Operating System Version

MacOS, Windows

Browser

Chrome

[linear]

ENG-2126 [BUG] - HeroUI not working when using in an npm package

[wingkwong]

please share a minimal reproducible environment.

[szbphoto]

@wingkwong i just created a public repo: https://github.com/szbphoto/herouibug

The bug can be found there.

1. npm i in the nextjs folder and in the npm_package folder also npm i and npm run build and when u start the nextjs proejct u will see

[davidaragundy]

Same issue here!

fresh nextjs project

[szbphoto]

Another note, if i add a modal into the NEXTJS project that isOpen prop is true then the npm package's modal opens too but without that it will not

[davidaragundy]

i was using tailwind v4, switching back to 3 fixed it

[szbphoto]

i was using tailwind v4, switching back to 3 fixed it

The sample i provided uses v3

[iSaulX]

This error is because currently HeroUI don't support Tailwind v4. Switch back to Tailwind v3 and you'll be fine.

There's an issue that mentions this #4644.

[szbphoto]

This error is because currently HeroUI don't support Tailwind v4. Switch back to Tailwind v3 and you'll be fine.

There's an issue that mentions this #4644.

I still using tailwind v3

[linyonglu]

Tailwind v3 will fine

[szbphoto]

Tailwind v3 will fine

I already said 3 times and you can see in the example that i use tailwind v3 so it is not a solution

[szbphoto]

@wingkwong any update regarding to this or workaround or like anything that i can do to continue my work until this is not fixed yet?