import type { PluginSimple } from 'markdown-it'; import type Token from 'markdown-it/lib/token'; import container from 'markdown-it-container'; import type { MarkdownParser } from '../types'; export const containerPlugin: PluginSimple = (parser: MarkdownParser) => { parser .use(...createContainer('note', 'NOTE')) .use(...createContainer('tip', 'TIP')) .use(...createContainer('info', 'INFO')) .use(...createContainer('warning', 'WARNING')) .use(...createContainer('danger', 'DANGER')) // Explicitly escape Vue syntax. .use(container, 'v-pre', { render: (tokens: Token[], idx: number) => tokens[idx].nesting === 1 ? `

\n` : `

\n`, }); }; type ContainerArgs = [ typeof container, string, { render(tokens: Token[], idx: number): string; }, ]; const SVG = { note: ` `, tip: ` `, info: ` `, warning: ` `, danger: ` `, }; function createContainer(klass: string, defaultTitle: string): ContainerArgs { return [ container, klass, { render(tokens, idx) { const token = tokens[idx]; const info = token.info.trim().slice(klass.length).trim(); if (token.nesting === 1) { return `

${ SVG[klass] }${info || defaultTitle}

\n`; } else { return `

\n`; } }, }, ]; }