Extensibility

Markdown Maestro is designed to be highly extensible. You can customize its behavior by overriding its renderer, tokenizer, and other core components.

Custom Renderer

You can change how Markdown elements are rendered into HTML by providing your own renderer. This is useful for adding custom classes, IDs, or even wrapping elements in custom components.

import { maestro } from 'markdown-maestro';

const renderer = new maestro.Renderer();

// Override how links are rendered
renderer.link = (href, title, text) => {
  return `<a target="_blank" rel="noopener noreferrer" href="${href}" title="${title}">${text}</a>`;
};

const html = maestro('[Example](https://example.com)', { renderer });

In the example above, all links will now automatically open in a new tab.

Custom Tokenizer

The tokenizer is responsible for breaking down the Markdown string into tokens. You can extend the tokenizer to support custom syntax that isn't part of the standard Markdown or GFM specifications.

import { maestro } from 'markdown-maestro';

const tokenizer = new maestro.Tokenizer();

// Add a rule for @mentions
const mentionRule = /^@([a-zA-Z0-9_]+)/;
tokenizer.rules.inline.mention = mentionRule;

// Teach the renderer what to do with this new token
const renderer = new maestro.Renderer();
renderer.mention = (username) => {
  return `<a href="https://github.com/${username}">@${username}</a>`;
};

const text = 'Hello, @username!';
const html = maestro(text, { tokenizer, renderer });

This powerful feature allows you to create your own dialect of Markdown tailored to your specific needs.