<commit_before># remark-vdom [![Build Status][build-badge]][build-status] [![Coverage Status][coverage-badge]][coverage-status] [![Chat][chat-badge]][chat]

**remark-vdom** compiles markdown to [Virtual DOM][vdom].  Built on
[**remark**][remark], an extensively tested and pluggable markdown
parser.

*   [x] Inherently safe and sanitized: there is no way to pass raw HTML through.
*   [x] Supports footnotes, todo lists;
*   [x] Support VNode [keys][vnode-key];
*   [x] Custom components overwriting default elements
    (`MyLink` instead of `<a>`);

## Installation

[npm][]:

```bash
npm install remark-vdom
```

## Usage

Dependencies:

```javascript
var remark = require('remark');
var vdom = require('remark-vdom');
```

Process:

```javascript
var vtree = remark()
  .use(vdom)
  .process('_Emphasis_, **importance**, and `code`.')
  .contents;
```

Yields (note it’s an array of nodes):

```txt
VirtualNode {
  tagName: 'DIV',
  properties: { key: undefined },
  children:
   [ VirtualNode {
       tagName: 'P',
       properties: { key: undefined },
       children:
        [ VirtualNode {
            tagName: 'EM',
            properties: { key: undefined },
            children: [ VirtualText { text: 'Emphasis' } ],
            key: 'h-3',<commit_msg>Simplify example<commit_after># remark-vdom [![Build Status][build-badge]][build-status] [![Coverage Status][coverage-badge]][coverage-status] [![Chat][chat-badge]][chat]

**remark-vdom** compiles markdown to [Virtual DOM][vdom].  Built on
[**remark**][remark], an extensively tested and pluggable markdown
parser.

*   [x] Inherently safe and sanitized: there is no way to pass raw HTML through.
*   [x] Supports footnotes, todo lists;
*   [x] Support VNode [keys][vnode-key];
*   [x] Custom components overwriting default elements
    (`MyLink` instead of `<a>`);

## Installation

[npm][]:

```bash
npm install remark-vdom
```

## Usage

```javascript
var remark = require('remark');
var vdom = require('remark-vdom');

var vtree = remark()
  .use(vdom)
  .process('_Emphasis_, **importance**, and `code`.')
  .contents;

console.dir(vtree, {depth: null});
```

Yields (note it’s an array of nodes):

```txt
VirtualNode {
  tagName: 'DIV',
  properties: { key: undefined },
  children:
   [ VirtualNode {
       tagName: 'P',
       properties: { key: undefined },
       children:
        [ VirtualNode {
            tagName: 'EM',
            properties: { key: undefined },
            children: [ VirtualText { text: 'Emphasis' } ],
            key: 'h-3',
{'fraction_non_alphanumeric': 0.16442687747035573, 'fraction_numerical': 0.0007905138339920949, 'mean_word_length': 3.5603603603603604, 'pattern_counts': {'":': 0, '<': 5, '<?xml version=': 0, '>': 5, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '3970587', 'n_tokens_mistral': 856, 'n_tokens_neox': 812, 'n_words': 232}