mdart-markdown-it

markdown-it v14 plugin that renders mdart fenced code blocks as inline SVG.

```mdart
type: cycle
title: Build–Measure–Learn

Plan → Build → Measure → Learn
```

Full syntax reference with rendered examples: docs/syntax.md

Install

npm install mdart mdart-markdown-it markdown-it

Usage

import MarkdownIt from 'markdown-it'
import { mdartPlugin } from 'mdart-markdown-it'

const md = new MarkdownIt().use(mdartPlugin())

const html = md.render(`
# Hello

\`\`\`mdart process
Discovery → Design → Build → Test → Deploy
\`\`\`
`)

Convenience wrapper

import { renderWithMarkdownIt } from 'mdart-markdown-it'

const html = renderWithMarkdownIt(markdown)

Configuration

mdartPlugin() is a factory — call it with an optional config to set plugin-level defaults:

import { configureMdArt } from 'mdart'
import { mdartPlugin, renderWithMarkdownIt } from 'mdart-markdown-it'

// Global — applies everywhere
configureMdArt({ theme: 'mono-light' })

// Plugin-level — overrides global for this md instance
const md = new MarkdownIt().use(mdartPlugin({ theme: 'mono-dark' }))

// Convenience wrapper with config
const html = renderWithMarkdownIt(markdown, { theme: 'mono-dark' })

How it works

The plugin overrides the fence renderer rule. When it encounters a fence with lang === 'mdart', it calls renderMdArt() from the mdart core package and returns the SVG inline. All other fenced blocks pass through to the original renderer unchanged.

The optional hint type can be appended after the language tag:

```mdart cycle
Plan → Build → Measure → Learn
```

Peer dependencies

{
  "mdart": ">=0.1.0",
  "markdown-it": ">=14.0.0"
}

License

MIT