How can I add a textarea element in Markdown?

[prathmesh796]

I want to render live updating content in markdown. How can I do it? I try doing it like this but it give an error: Type 'Element' is not assignable to type 'string'.

<Markdown>
        <textarea
          className="min-h-screen h-auto w-full resize-none border-none bg-transparent focus:outline-none"
          value={noteContent}
          onChange={(e) => setNoteContent(e.target.value)}
        />
</Markdown>

[remcohaszing]

Do you mean something like this?

function MarkdownEditor() {
  const [noteContent, setNoteContent] = useState('')

  return (
    <>
      <Markdown>{noteContent}</Markdown>
      <textarea
        className="min-h-screen h-auto w-full resize-none border-none bg-transparent focus:outline-none"
        value={noteContent}
        onChange={(e) => setNoteContent(e.target.value)}
      />
    </>
  )
}

[prathmesh796]

Yes, but this shows the content twice -

Screen.Recording.2026-07-08.140827.mp4

I want to implement a Obsidian like editor, in which you can directly edit the markdown text -

Screen.Recording.2026-07-08.141337.mp4

[remcohaszing]

In that case you should look for a markdown WYSIWYG editor. react-markdown is a markdown renderer.

[prathmesh796]

Okay, i will try it out.