Mint package for converting markdown to html. Uses Micromark under the hood.

The easiest way to use Micromark is with Micromark.Component:

component Main {
  fun render {
    <Micromark.Component content="# Hello world"/>
  }
}

You can enable extensions to unlock additional functionality:

component Main {
  fun render {
    <Micromark.Component
      extensions=[Micromark.Extension::Gfm]
      content="~~strikethrough~~"/>
  }
}

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}}`}/>
        }
    }
  }
}

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.

• Be extremely easy to use
• On-demand loading - extensions and css are optional and loaded on demand

• Be fully featured. This package intentionally uses Micromark as the underlying markdown engine because micromark about as minimal as it can get.