bokuweb / react-rnd

🖱 A resizable and draggable component for React.
https://bokuweb.github.io/react-rnd/stories
MIT License
3.95k stars 326 forks source link

Define callback refs inline to work with latest versions of Next.js / React #942

Closed jmurty closed 5 months ago

jmurty commented 5 months ago

Callback refs defined as class functions don't get invoked in Next.js 14.2+ – and therefore don't work – perhaps because of changes to the underlying React which is at or near version 19.

This should fix https://github.com/bokuweb/react-rnd/issues/941 along with the related PR on re-resizable: https://github.com/bokuweb/re-resizable/pull/819

Tested and confirmed to work with the latest stable version of Next.js 14.2.3

jmurty commented 5 months ago

Thanks very much for this awesome library bokuweb! It's vital to a big project of ours where we are using it to do some pretty cool things, which will be made public soon.

Unfortunately – along with so many other libraries and issues – updates to Next.js (and/or maybe React?) break this library for recent versions of that framework.

I found that moving callback ref function definitions to be inline when used with a component, instead of class functions, was enough to fix our Next 14.2.3 project. I don't know why this change was necessary, I've searched but haven't found anyone else talking about changes to how callback refs can/should be defined or how they work.

Please consider merging in this change – and the very similar related change in https://github.com/bokuweb/re-resizable/pull/819 – so we and others can continue to benefit from this great work.

Let me know if you need any more info, or would like me to change these PRs.