[BUG] - Blank white screen appears when using Textarea component

[rsinghcodes]

Describe the bug

When I am using Textarea component inside my app, it is throwing console errors and my screen turns white blank.

Your Example Website or App

No response

Steps to Reproduce the Bug or Issue

1. Create Home.tsx file, and import Teaxtarea component from @nextui-org/react.
2. Use Textarea component inside Home.tsx.
3. Impot Home.tsx file in App.tsx by using lazy and Suspense.
4. Now, use react-router-dom for routing.
5. Start localhost and view it in your browser.

Expected behavior

No blank white screen should appear and the application should not break.

Screenshots or Videos

Operating System Version

Windows

Browser

Chrome

[sun0day]

Can you provide a mini-reproduction on sandbox or stackblitz? @rsinghcodes

[rsinghcodes]

Hi @sun0day, I ran the code on both sandbox and stackblitz, but this problem is not happening there. I tested locally in my two different machines and this issue is still visible i.e. blank white screen. Can you run locally and check if this problem is happening locally on your system?

I'm using "react": "^18.2.0", "react-dom": "^18.2.0", "react-scripts": "5.0.1", "react-icons": "^4.4.0", "react-router-dom": "^6.3.0", and "typescript": "^4.7.4".

Thanks!

[sun0day]

It seems like the problem happens in your webpack config. Can you push your code to your github repo?

[rsinghcodes]

Sure, here is my repo.

[sun0day]

Error reason is that there are circular dependencies between Input and Textarea.

https://github.com/nextui-org/nextui/blob/1becf041d836c0c50edeee5a7f2090e00f98668a/packages/react/src/input/index.ts#L1

https://github.com/nextui-org/nextui/blob/1becf041d836c0c50edeee5a7f2090e00f98668a/packages/react/src/textarea/textarea.tsx#L4