Upgrading to react 19, throws errors on custom blocks - Accessing element.ref was removed in React 19. ref is now a regular prop. #1293
Description
Describe the bug
Custom blocks throws run time console error after upgrading to react 19.
Console error: “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.”
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. Component Stack:
r ReactBlockSpec.tsx:162
ReactNodeView unknown:0
Ao EditorContent.tsx:6
Uo EditorContent.tsx:28
Wo BlockNoteView.tsx:91
MantineThemeProvider MantineThemeProvider.tsx:17
MantineProvider MantineProvider.tsx:13
dt index.tsx:141
App App.tsx:126
:1:145535
To Reproduce
goto examples/06-custom-schema/react-custom-blocks
Upgrade react pkgs in package.json with the following:
"react": "19.0.0-rc-66855b96-20241106",
"react-dom": "19.0.0-rc-66855b96-20241106"
Browser: Firefox and Chrome
Open browser console and you would see the error when the page loaded.
Here is the stackblitz link:
https://stackblitz.com/~/github.com/dvarjun/react19-bug-react-custom-blocks