Plugin to create block-level custom containers for markdown-it markdown parser
npm install @hackmd/markdown-it-container
> Plugin for creating block-level custom containers for markdown-it markdown parser.
__v2.+ requires markdown-it v5.+, see changelog.__
With this plugin you can create block containers like:
``
::: warning
here be dragons
:::
.... and specify how they should be rendered. If no renderer defined,
with
container name class will be created:`html
here be dragons
`Markup is the same as for fenced code blocks.
Difference is, that marker use another character and content is rendered as markdown markup.
Installation
node.js, browser:
bash
$ npm install markdown-it-container --save
$ bower install markdown-it-container --save
`
API
js
var md = require('markdown-it')()
.use(require('markdown-it-container'), name [, options]);
`Params:
- __name__ - container name (mandatory)
- __options:__
- __validate__ - optional, function to validate tail after opening marker, should
return
on success.
- __render__ - optional, renderer function for opening/closing tokens.
- __marker__ - optional (:), character to use in delimiter.
Example
`js
var md = require('markdown-it')();md.use(require('markdown-it-container'), 'spoiler', {
validate: function(params) {
return params.trim().match(/^spoiler\s+(.*)$/);
},
render: function (tokens, idx) {
var m = tokens[idx].info.trim().match(/^spoiler\s+(.*)$/);
if (tokens[idx].nesting === 1) {
// opening tag
return '' + md.utils.escapeHtml(m[1]) + '
\n';
} else {
// closing tag
return '\n';
}
}
});
console.log(md.render('::: spoiler click me\ncontent\n:::\n'));
// Output:
//
// click me
// content
//
``