remark@next (13)

[wooorm]

Hi!

remark is switching to a new parser (and compiler) internally (remarkjs/remark#536), which will break this plugin. I will create a generic directives plugin though, time permitting, in this month, which would be a good inspiration for fenced divs. Keep an eye out that plugin, which will also have micromark and mdast extensions too, and feel free to ask me questions!

[benabel]

Hi @wooorm and thanks for your interest. For now I can't really understand the steps to port the plugin. Is it?

1. Create a micromark-extension-fenced-div to parse the markdown source.
2. Use this extension iin thé remark plugin.
3. Dont do anything in the Gatsby remark plugin.

[wooorm]

Correct, a micromark extension which plugs into the micromark parser, and an adapter to turn that into mdast. You don’t have to publish them all separately (in which case you don’t need the HTML adapter in the micromark extension either), they can be in this project.

Finally, extending the syntax of Markdown may not be a good idea, because a fenced div inside a document is not portable (it doesn’t render here on GitHub, or in some blogging tool). As I said, I’ll create a generic directives extension, which seems to a favourite in other markdown parsers too, and may (eventually?) come to CommonMark. An alternative would be to not continue with fenced-divs per Pandoc-style, but instead push generic directives?

[wooorm]

I have created a micromark extension for my interpretation of the generic directive syntax: https://github.com/micromark/micromark-extension-directive And a corresponding utility for mdast: https://github.com/syntax-tree/mdast-util-directive And wrapped ’em all up in: https://github.com/remarkjs/remark-directive

I hope those serve as inspiration: note that you don’t have to split them up in several repos, but that’s how I like to work.

Finally, something like remark-fenced-divs can be done with remark-directive too, where remark-directive handles the syntax and tree, and remark-fenced-divs changes the tree to create divs?

[benabel]

Thanks for your support @woorm, I've updated the package to add remark<13 as a peer dependencie.

I made some investigations on your last proposition:

Finally, something like remark-fenced-divs can be done with remark-directive too, where remark-directive handles the syntax and tree, and remark-fenced-divs changes the tree to create divs?

However, the pandoc fenced_div syntax isn't compatible with the remark-directive one because attributes are not parsed the same way:

• pandoc allows spaces: ::: my-div
• generic-directive requires a name but pandoc allow only named or curly braces attributes, but not the two at the same time.

The generic directive syntax seems promising but it is not implemented in pandoc and I need pandoc in my workflow because I need to generate both html and pdf via latex. (Creating the generic-directive extension for pandoc would be a solution but haskell isn't my cup of tea)

I'll investigate on a hack of the remark-math plugin modification as I did when I created the plugin earlier.

[wooorm]

pandoc allows spaces: ::: my-div

Does it allow it, or require it? If the first, you could document it. If the second, maybe we could add them. At the bottom of the readme of micromark-extension-directive I listed a couple of limitations, some of those could be discussed and maybe added?

generic-directive requires a name but pandoc allow only named or curly braces attributes, but not the two at the same time.

That indeed seems more of a blocker. A fork, though?

(Creating the generic-directive extension for pandoc would be a solution but haskell isn't my cup of tea)

Hmmm. Yeah. They do also have the commonmark flavor of markdown instead of pandoc. But I googled a bit and don’t seem to have an extension for generic directives.

[benabel]

@wooorm I created a new implementation based on remark-directive, however I don't really understand what is the html.js file for.

The current implementation is incomplete and I can't figure out how to implement the stack to make nested divs work again.

[wooorm]

however I don't really understand what is the html.js file for.

Does my earlier comment above help?

Correct, a micromark extension which plugs into the micromark parser, and an adapter to turn that into mdast. You don’t have to publish them all separately (in which case you don’t need the HTML adapter in the micromark extension either), they can be in this project.

---

The current implementation is incomplete and I can't figure out how to implement the stack to make nested divs work again.

I am not familiar with pandocs divs, so I can’t advise on them. micromark-extension-directive also supports nesting. Could you expand on what is missing for nesting to work here?