Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Issue with PrimeReact Dialog on Next.js 15 and React 19 #7403

Open
ARBS-23 opened this issue Nov 9, 2024 · 2 comments
Open

Issue with PrimeReact Dialog on Next.js 15 and React 19 #7403

ARBS-23 opened this issue Nov 9, 2024 · 2 comments
Labels
Component: NextJS NextJS related issue

Comments

@ARBS-23
Copy link

ARBS-23 commented Nov 9, 2024

Describe the bug

While using the PrimeReact Dialog component in a project with Next.js 15 and React 19, the following warning message appears:

"Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release. Cannot update a component (HotReload) while rendering a different component (ForwardRef). To locate the bad setState() call inside ForwardRef, follow the stack trace as described in https://react.dev/link/setstate-in-render."

This issue seems to stem from changes in how ref is handled in React 19, potentially causing incompatibilities with PrimeReact’s Dialog component.

Reproducer

https://stackblitz.com/edit/vitejs-vite-pbvvz3

System Information

- React: 19.0.0-rc-66855b96-20241106
- Next.js: 15.0.3
- PrimeReact: 10.8.4
- TypeScript: 5.x
- Operating System: Windows 11

Steps to reproduce the behavior

  • Create a Next.js app with React 19 and PrimeReact 10.8.4.
  • Add the above code to render a simple Dialog component.
  • Click the button to show the dialog.
  • Observe the console warning message related to element.ref and HotReload issues.

Expected behavior

The Dialog component should render without any console warnings or errors, maintaining compatibility with React 19’s handling of ref as a regular prop.

@ARBS-23 ARBS-23 added the Status: Needs Triage Issue will be reviewed by Core Team and a relevant label will be added as soon as possible label Nov 9, 2024
@melloware melloware added Component: NextJS NextJS related issue and removed Status: Needs Triage Issue will be reviewed by Core Team and a relevant label will be added as soon as possible labels Nov 9, 2024
@DanielOberlechner
Copy link

got the exact same issue! Hope for a resolution...

@ameerhamza0403
Copy link

Facing same issue, Any update ?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Component: NextJS NextJS related issue
Projects
None yet
Development

No branches or pull requests

4 participants