# @marks-js/mermaid

> Mermaid plugin for Marks rendering engine

Latest version **1.0.63** (published 2021-01-23) · MIT license · 0 weekly downloads

## Install

```sh
npm install @marks-js/mermaid
pnpm add @marks-js/mermaid
yarn add @marks-js/mermaid
bun add @marks-js/mermaid
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.63 |
| Published | 2021-01-23 |
| First published | 2020-07-04 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 1 |
| Unpacked size | 16.1 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | NoMoreDeps |
| Maintainers | fskorzec |

## Links

- npm: https://www.npmjs.com/package/@marks-js/mermaid
- npm.io page: https://npm.io/package/@marks-js/mermaid

## Dependencies (1)

- [@marks-js/marks](https://npm.io/package/@marks-js/marks.md) ^1.1.30

## Recent versions

- 1.0.63 (latest) — 2021-01-23
- 1.0.58 — 2021-01-08
- 1.0.57 — 2021-01-07
- 1.0.56 — 2021-01-07
- 1.0.55 — 2020-09-15
- 1.0.54 — 2020-07-19
- 1.0.53 — 2020-07-19
- 1.0.52 — 2020-07-19
- 1.0.49 — 2020-07-19
- 1.0.48 — 2020-07-19
- 1.0.47 — 2020-07-19
- 1.0.44 — 2020-07-12
- 1.0.43 — 2020-07-12
- 1.0.38 — 2020-07-08
- 1.0.37 — 2020-07-08
- … 9 more at https://npm.io/package/@marks-js/mermaid/versions

## README

# Mermaid plugin for Marks

Generation of diagrams and flowcharts from text in a similar manner as markdown. Ever wanted to simplify documentation and avoid heavy tools like Visio when explaining your code ? This is why mermaid was born, a simple markdown-like script language for generating charts from text via javascript.

[Official website](https://mermaid-js.github.io/mermaid "new")

[Marks documentation](https://marksjs.com/pluging-mermaid)

## Getting Started

```bash
# With npm
npm i -S @marks-js/mermaid

# With yarn
yarn add @marks-js/mermaid
```

#### Adding it in the code

```typescript
// Importing and adding it
import { BlockMermaidRenderer } from "@marks-js/mermaid";

const renderer = new MarksRenderer();
renderer.registerRenderers(
  /* ... */
  new BlockMermaidRenderer(),
  /* ... */
  );

  // You can override version manually
const renderer = new MarksRenderer();
renderer.registerRenderers(
  /* ... */
  new BlockMermaidRenderer({ version: "8.8.0" }),
  /* ... */
  );
```

#### From CDN for direct use

```html
<!-- Latest version -->
<script src="https://unpkg.com/@marks-js/mermaid/dist/Marks.Mermaid.dist.js"></script>

<!-- Or a specific one-->
<script src="https://unpkg.com/@marks-js/mermaid@8.8.0/dist/Marks.Mermaid.dist.js"></script>
```

```typescript
// Adding it

const renderer = new Marks.MarksRenderer();

const mermaidPlugin = new Marks_Mermaid.BlockMermaidRenderer();
renderer.registerRenderers(
  ...Marks.Plugins.map(_ => new _()),
  mermaidPlugin
);
```

---
_Source: https://npm.io/package/@marks-js/mermaid · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._