xdm: Where to replace code blocks with custom JavaScript

Given a function createCodeSnippetComponent that transforms a snippet of source code into a JavaScript function representing a React component that renders that code, how and where would I hook into the pipeline to swap the node?

Specifically, if the createCodeSnippetComponent returns a string representation of the React component, where might I be able to replace the whole fenced code block with an MDX element representing that code?

About this issue

  • Original URL
  • State: closed
  • Created 3 years ago
  • Comments: 29 (10 by maintainers)

Most upvoted comments

@ggoodman very cool to see the whole, a few of my open questions from the conversion now fall into place. This looks nice!

For anyone following in my internet footsteps, the code that arose from this discussion can be found here: https://github.com/ggoodman/nostalgie/blob/720d2f5f334ffbaf4201fcf628f6f345af15cc0f/src/worker/mdxCompiler.ts#L76-L160.

Thanks for your help and (especially) patience @wooorm and @ChristianMurphy.

On top of that, the nestled implications that you don’t have time to explain your problem and yet, that we have the time guess the right answer by reading between the lines in vague comments, are not appreciated.

Thanks for calling that out. You two have both been engaging in good faith and I appreciate the dialogue. I will come back with a better explanation of the context. Perhaps with that, we’ll be able to come to the best solution across the board and maybe all learn something in the process.

I posted a suggestion before, using recma/esast: https://github.com/wooorm/xdm/issues/9#issuecomment-779638239, and some other ideas.

While it’s fun discussing alternative approaches

I’m not asking questions because it’s my idea of fun; I do find asking questions the best way to figure out what context you have. Context is important.

Would there be any ways to get a sort of functional […] before passing the source through the acorn parse?

Why should this happen before acorn parse? acorn parsing is the very first thing that happens (at the same time markdown is parsed)