How to use crepe editor with react

[sytolk]

maybe useCrepe() hook is missing? https://milkdown.dev/docs/recipes/react

[KBHertzog]

You can instantiate a new Crepe instance within the useEditor hook. Just make sure to return the editor on the Crepe object.

useEditor(
    (root) =>
      new Crepe({root}).editor);

Something like the above should work in this case.

[seangwright]

This doesn't exactly work. The Crepe UI elements (<milkdown-link-preview>, <milkdown-block-handle>, <milkdown-toolbar>) won't render if you just return the crepe.editor.

Instead you need to return the Crepe instance from the callback you pass to useEditor.

Unfortunately this introduces its own problems with React re-renders, plugins that have already been initialized and the Crepe instance not being correctly cleaned up.

It's clear Crepe was not designed for this use case, unfortunately.