CtrlK
BlogDocsLog inGet started
Tessl Logo

tessl/npm-remarkable

High-performance Markdown parser with full CommonMark support, syntax extensions, and configurable rule systems.

Pending
Overview
Eval results
Files

core-parser.mddocs/

Core Parser

The Remarkable class provides the main parsing functionality for converting markdown to HTML with configurable presets and options.

Capabilities

Remarkable Constructor

Creates a new Remarkable parser instance with optional preset and configuration.

/**
 * Create a new Remarkable parser instance
 * @param preset - Preset name: 'default', 'full', or 'commonmark'
 * @param options - Parser configuration options
 */
class Remarkable {
  constructor(preset?: string, options?: RemarkableOptions);
}

interface RemarkableOptions {
  /** Enable HTML tags in source (default: false) */
  html?: boolean;
  /** Use '/' to close single tags like <br /> (default: false) */
  xhtmlOut?: boolean;
  /** Convert '\n' in paragraphs into <br> (default: false) */
  breaks?: boolean;
  /** CSS language prefix for fenced blocks (default: 'language-') */
  langPrefix?: string;
  /** Target attribute for links (default: '') */
  linkTarget?: string;
  /** Enable typographic replacements (default: false) */
  typographer?: boolean;
  /** Quote replacement pairs when typographer enabled (default: '""''') */
  quotes?: string;
  /** Highlighter function for code blocks */
  highlight?: (str: string, lang: string) => string;
  /** Internal protection, recursion limit (default: 20) */
  maxNesting?: number;
}

Usage Examples:

import { Remarkable } from "remarkable";

// Default configuration
const md = new Remarkable();

// With preset
const mdFull = new Remarkable('full');

// With preset and options
const mdCustom = new Remarkable('commonmark', {
  html: true,
  typographer: true,
  breaks: true,
  linkTarget: '_blank'
});

Render Method

Main method to convert markdown to HTML.

/**
 * Convert markdown string to HTML
 * @param markdown - Markdown source string
 * @param env - Environment object for storing references and metadata
 * @returns HTML string
 */
render(markdown: string, env?: object): string;

Usage Examples:

const md = new Remarkable();

// Basic rendering
const html = md.render('# Hello\n\nThis is **bold**.');
// Output: '<h1>Hello</h1>\n<p>This is <strong>bold</strong>.</p>\n'

// With environment for references
const env = {};
const htmlWithRefs = md.render(`
# Title

[link][ref]

[ref]: https://example.com "Title"
`, env);

console.log(env.references); // Contains reference definitions

Parse Method

Parse markdown and return tokens array without rendering to HTML.

/**
 * Parse markdown string and return tokens array
 * @param markdown - Markdown source string
 * @param env - Environment object for storing references and metadata
 * @returns Array of tokens representing the parsed structure
 */
parse(markdown: string, env?: object): Token[];

Usage Examples:

const md = new Remarkable();

const tokens = md.parse('# Hello\n\nThis is **bold**.');
// Returns array of Token objects representing the structure

Inline Rendering Methods

Methods for parsing and rendering inline markdown without paragraph wrapping.

/**
 * Render inline markdown without paragraph wrapping
 * @param markdown - Inline markdown string
 * @param env - Environment object
 * @returns HTML string without block-level wrapping
 */
renderInline(markdown: string, env?: object): string;

/**
 * Parse inline markdown and return tokens
 * @param markdown - Inline markdown string
 * @param env - Environment object
 * @returns Array of inline tokens
 */
parseInline(markdown: string, env?: object): Token[];

Usage Examples:

const md = new Remarkable();

// Inline rendering - no <p> tags
const inline = md.renderInline('This is **bold** and *italic*');
// Output: 'This is <strong>bold</strong> and <em>italic</em>'

// Parse inline tokens
const inlineTokens = md.parseInline('**bold** text');

Configuration Methods

Methods for setting options and applying configurations after instantiation.

/**
 * Set parser options
 * @param options - Options to merge with current configuration
 */
set(options: RemarkableOptions): void;

/**
 * Apply preset configuration
 * @param presets - Preset configuration object
 */
configure(presets: PresetConfig): void;

interface PresetConfig {
  options?: RemarkableOptions;
  components?: {
    core?: { rules: string[] };
    block?: { rules: string[] };
    inline?: { rules: string[] };
  };
}

Usage Examples:

const md = new Remarkable();

// Update options
md.set({
  html: true,
  typographer: true
});

// Apply custom preset
md.configure({
  options: { breaks: true },
  components: {
    block: { rules: ['paragraph', 'heading', 'list'] },
    inline: { rules: ['text', 'emphasis'] }
  }
});

Plugin System

Method for using plugins to extend functionality.

/**
 * Use a plugin to extend functionality
 * @param plugin - Plugin function that modifies the parser
 * @param options - Options to pass to the plugin
 * @returns The Remarkable instance for chaining
 */
use(plugin: PluginFunction, options?: object): Remarkable;

type PluginFunction = (md: Remarkable, options?: object) => void;

Usage Examples:

import { Remarkable } from "remarkable";
import { linkify } from "remarkable/linkify";

const md = new Remarkable()
  .use(linkify)
  .use(customPlugin, { option: 'value' });

function customPlugin(md, options) {
  // Add custom rules or modify parser
  md.renderer.rules.custom_rule = function(tokens, idx) {
    return '<div class="custom">Content</div>';
  };
}

Parser Components

Access to internal parser components for advanced customization.

interface Remarkable {
  /** Core parser for processing phases */
  core: ParserCore;
  /** Block-level parser */
  block: ParserBlock;
  /** Inline parser */
  inline: ParserInline;
  /** HTML renderer */
  renderer: Renderer;
  /** Rule manager */
  ruler: Ruler;
  /** Current options */
  options: RemarkableOptions;
}

interface ParserCore {
  ruler: Ruler;
  process(state: StateCore): void;
}

interface ParserBlock {
  ruler: Ruler;
  tokenize(state: StateBlock, startLine: number, endLine: number): void;
  parse(str: string, options: RemarkableOptions, env: object, outTokens: Token[]): void;
}

interface ParserInline {
  ruler: Ruler;
  validateLink: (url: string) => boolean;
  skipToken(state: StateInline): void;
  tokenize(state: StateInline): void;
  parse(str: string, options: RemarkableOptions, env: object, outTokens: Token[]): void;
}

// State classes used in rule development
class StateCore {
  constructor(instance: Remarkable, str: string, env: object);
  src: string;
  env: object;
  options: RemarkableOptions;
  tokens: Token[];
  inlineMode: boolean;
  inline: ParserInline;
  block: ParserBlock;
  renderer: Renderer;
}

Preset Configurations

Default Preset

Basic markdown parsing with safe defaults.

// Equivalent to:
const md = new Remarkable('default');
// or
const md = new Remarkable();

Features:

  • Core parsing rules enabled
  • HTML disabled for security
  • Basic inline and block elements
  • No advanced typography features

Full Preset

All features enabled including advanced syntax extensions.

const md = new Remarkable('full');

Features:

  • All parsing rules enabled
  • Advanced elements: tables, footnotes, definition lists
  • Strikethrough, subscript, superscript, mark, insert
  • Abbreviations and typographic replacements

CommonMark Preset

Strict CommonMark specification compliance.

const md = new Remarkable('commonmark');

Features:

  • CommonMark specification compliance
  • Minimal rule set for compatibility
  • No syntax extensions
  • Standard behavior for all elements

Install with Tessl CLI

npx tessl i tessl/npm-remarkable

docs

core-parser.md

index.md

linkify.md

rendering.md

rule-system.md

utilities.md

tile.json