Editor cannot be used with Next.js

[LBBO]

Describe the bug In a clean Next.js project, when I npm install @monaco-editor/react and simply try to display an editor somewhere (which should be possible, as per the docs), I get an error

Error: useState only works in Client Components. Add the "use client" directive at the top of the file to use it.

To Reproduce See this CodeSandbox

Steps to reproduce the behavior:

1. Create fresh Next.js app (I used the CodeSandbo "Next.js (App Router)" template)
2. Install @monaco-editor/react
3. Display an <Editor /> somewhere
4. See above error
5. Optionally try to wrap the import in a dynamic(..., { ssr: false }), same result

Expected behavior There should be no error, as per the docs linked above.

Desktop (please complete the following information):

• OS: macOS
• Browser Arc
• Version 4.6.0

Additional context I briefly checked the source code and found a 'use client' at the top of the corresponding TSX files. However, that 'use client' seems to get lost in the build process because it isn't present in the final index.mjs.

[suren-atoyan]

you need to use "use client" at the top of the file where you use the editor