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

[ARBS-23]

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.

[DanielOberlechner]

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