Shadcn and Tailwind error: "forwardRef render functions accept exactly two parameters: props and ref. Did you forget to use the ref parameter?"
francesco-bosia opened this issue · comments
Francesco Bosia commented
Describe the bug
Instantiating the editor with Shadcn and Tailwindcss in NextJS produces the following error:
Warning: forwardRef render functions accept exactly two parameters: props and ref. Did you forget to use the ref parameter?
To Reproduce
- Set up NextJS with create-next-app
- Create a client component
- `const schema = BlockNoteSchema.create({
blockSpecs: {
// Adds all default blocks.
paragraph: defaultBlockSpecs.paragraph,
bulletListItem: defaultBlockSpecs.bulletListItem
},
});
function CustomEditor ({ config }: { config: EditorProps }) {
// Creates a new editor instance.
const editor = useCreateBlockNote({schema});
// For initialization; on mount, convert the initial HTML to blocks and replace the default editor's content
useEffect(() => {
async function loadInitialHTML() {
//const blocks = await editor.tryParseHTMLToBlocks(config.inputData);
const blocks = await editor.tryParseHTMLToBlocks(config.inputData);
editor.replaceBlocks(editor.document, blocks);
}
loadInitialHTML();
}, [editor]);
const onChange = async () => {
// Converts the editor's contents from Block objects to HTML and store to state.
const html = await editor.blocksToHTMLLossy(editor.document);
//config.onChange(html)
console.log(html)
};
// Renders the editor instance using a React component.
return (
<div className="editor-container style-for-editor border-2 border-gray-100 rounded-md px-4 py-3 max-w-full">
<BlockNoteView editor={editor} onChange={onChange} />
</div>
);
}`
- Integrate multiple instances of the editor in another component
const SectionBlock = dynamic(() => import("@/components/CustomEditor"), { ssr: false, }); ... <SectionBlock config={{ inputData: field.value, onChange: (data) => { field.onChange(data) }, }} />
Misc
- Node version: 21.7.1
- Package manager: npm
- Browser: Edge 124.0.2478.80
Shouryan Nikam commented
Any update on this?