Nice! Seems very useful if you can drop in and have everything work.
Nitpicking a bit: it's not as much _rendering_ markdown as it's _syntax highlighting_ it. Another interesting approach there could be to use the CSS Custom Highlight API [0]. Then it wouldn't need the preview div, and perhaps it'd even be possible to have non-mono fonts and varying size text for headers.
[0] https://developer.mozilla.org/en-US/docs/Web/API/CSS_Custom_...
Can you use highlights on text area contents?
You can't mainly because <textarea> separately tracks its own selection, AFAIK.
There is a proposal to add support for this:
https://github.com/MicrosoftEdge/MSEdgeExplainers/blob/main/...
The animated exploded demo definitely shows formatting differently from plain text (bold is bold, hyphens replaced with bullets.)
Fair, but so do many syntax highlighters (at least bold, italic, titles...).
Ya that's true