Editable code blocks with live preview

[DanielFGray]

I accomplished this with @codesandbox/sandpack but it would be great to have codehike's beautiful code blocks instead of a different highlighting/rendering engine

I wonder if this could be accomplished by layering a transparent textarea over the top of the code block? And then sending the new code to sandpack renderer, or react-runner, react-live, whatever works

Just to kick around an idea onto your back burner

[pomber]

Using code hike to re-render the edited code would be hard, right now code hike does all the syntax highlighting on the server when the MDX is transformed to JSX.

So, right now this is out of scope, but maybe we could add something like this in the future.

[texastoland]

I'd also like to find a way to integrate https://github.com/viebel/klipse someday if I use CH heavily 🤞

Examples:

• https://blog.klipse.tech/clojure/2020/09/10/new-way-html-css.html
• https://blog.klipse.tech/clojure/2019/02/17/reframe-tutorial.html
• https://book.klipse.tech/