Pages
mint-micromark
Basic information
Entities
Versions
Dependencies
Mint Micromark
Mint package for converting markdown to html. Uses Micromark under the hood.
Basic usage
The easiest way to use Micromark is with Micromark.Component
:
component Main {
fun render {
<Micromark.Component content="# Hello world"/>
}
}
Extensions
You can enable extensions to unlock additional functionality:
component Main {
fun render {
<Micromark.Component
extensions=[Micromark.Extension::Gfm]
content="~~strikethrough~~"/>
}
}
Advanced usage
If you want to directly access micromark, you can use the Micromark.load
API
component Main {
state micromark : Maybe(Function(String, String)) = (content: String) {content}
fun componentDidMount {
let micromark =
await Micromark.load([Micromark.Extension::Gfm])
next { micromark: Maybe::Just(micromark) }
}
fun render {
case micromark {
=> <></>
Maybe::Just(micromark) =>
{
let html =
micromark(content)
<div dangerouslySetInnerHTML={`{__html: #{html}}`}/>
}
}
}
}
Why this package?
Mint supports out of the box markdown rendering using a here doc:
<<#MARKDOWN
# Hello world!
MARKDOWN
This is an amazing feature and great for simple markdown.
However, the Crystal shard used to enable this feature doesn't have support for some popular markdown extensions like GFM.
Goals
- Be extremely easy to use
- On-demand loading - extensions and css are optional and loaded on demand
Non-goals
- Be fully featured. This package intentionally uses Micromark as the underlying markdown engine because micromark about as minimal as it can get.