# @dash4/plugin-readme

> dash4 plugin readme

Latest version **0.9.3** (published 2020-12-07) · MIT license · 0 weekly downloads

## Install

```sh
npm install @dash4/plugin-readme
pnpm add @dash4/plugin-readme
yarn add @dash4/plugin-readme
bun add @dash4/plugin-readme
```

## Health

**Score 35/100 (D)** — status: abandoned.

Positive: has types; no vulnerabilities; high quality score.

Warnings: low downloads; no esm support; pre 1.0.

Negative: abandoned.

## Facts

| | |
|---|---|
| Version | 0.9.3 |
| Published | 2020-12-07 |
| First published | 2019-04-07 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | CommonJS |
| Dependencies | 7 |
| Unpacked size | 1.4 MB |
| Known vulnerabilities | 0 (+1 in 1 direct dependencies) |
| Install scripts | no |
| GitHub stars | 20 |
| Author | Simon Mollweide |
| Maintainers | smollweide |

## Links

- npm: https://www.npmjs.com/package/@dash4/plugin-readme
- Repository: https://github.com/smollweide/dash4
- Homepage: https://github.com/smollweide/dash4#readme
- Issues: https://github.com/smollweide/dash4/issues
- npm.io page: https://npm.io/package/@dash4/plugin-readme

## Dependencies (7)

- [fs-extra](https://npm.io/package/fs-extra.md) 9.0.1
- [@dash4/log](https://npm.io/package/@dash4/log.md) 0.9.3
- [mime-types](https://npm.io/package/mime-types.md) 2.1.27
- [node-emoji](https://npm.io/package/node-emoji.md) 1.10.0
- [highlight.js](https://npm.io/package/highlight.js.md) 10.4.1
- [@dash4/server](https://npm.io/package/@dash4/server.md) 0.9.3
- [markdown-to-jsx](https://npm.io/package/markdown-to-jsx.md) 7.1.0

## Recent versions

- 0.9.3 (latest) — 2020-12-07
- 0.9.2 — 2020-11-18
- 0.9.1 — 2020-11-18
- 0.9.0 — 2020-08-22
- 0.8.5 — 2020-06-05
- 0.8.4 — 2020-05-09
- 0.8.3 — 2020-05-01
- 0.8.2 — 2020-04-09
- 0.8.1 — 2020-03-15
- 0.8.0 — 2020-01-24
- 0.7.1 — 2019-12-20
- 0.7.0 — 2019-11-15
- 0.6.0 — 2019-11-03
- 0.5.2 — 2019-10-24
- 0.5.1 — 2019-07-20
- … 6 more at https://npm.io/package/@dash4/plugin-readme/versions

## README

<div align="center">

<h1>Dash4 Plugin Readme</h1>
Show readme files on your Dash4 Dashboard

<br />
<br />

[![NPM version](https://badge.fury.io/js/%40dash4%2Fplugin-readme.svg)](https://www.npmjs.com/package/@dash4/plugin-readme)
[![License](https://img.shields.io/badge/license-MIT-green.svg)](http://opensource.org/licenses/MIT) [![Commitizen friendly](https://img.shields.io/badge/commitizen-friendly-brightgreen.svg)](http://commitizen.github.io/cz-cli/) [![Prettier](https://img.shields.io/badge/Code%20Style-Prettier-green.svg)](https://github.com/prettier/prettier)

<br />
<img src="https://user-images.githubusercontent.com/2912007/54718716-70e9fa00-4b5b-11e9-9c76-da9a41b3a177.gif" style="max-width:400px; width:100%" alt="Dash4 Plugin Readme screencast" />

<br />
<br />
</div>

## Table of Contents

* [Installation](#installation)
* [Usage](#usage)
  * [Readme](#usage-readme)
  * [Readme list](#usage-readme-list)
* [License](#license)

## <a name="installation">Installation</a>

```shell
npm i -D @dash4/plugin-readme
```

## <a name="usage">Usage</a>

### <a name="usage-readme">Readme</a>

> By using the PluginReadme you can add single Readme file to your Dash4 Dashboard

*dash4.config.js*

```js
const { PluginReadme } = require('@dash4/plugin-readme');

async function getConfig() {
  return {
    tabs: [
      {
        title: 'Root',
        rows: [
          [
            new PluginReadme({
              file: 'README.md',
            }),
          ],
        ],
      },
    ],
  };
}

module.exports = getConfig;
```

*PluginReadme options:*

```ts
// relative path to the README file
file: string;
// grid with per breakpoint
// [12,6,3] means 100% width on small viewports, 50% on medium viewports and 33.3% on large viewports
width?: number[];
// height of readme window in pixels, percent or viewheight (vh)
height?: number | string;
```

### <a name="usage-readme-list">Readme list</a>

> By using the PluginReadmeList you can add multiple Readme files on one card to your Dash4 Dashboard

*dash4.config.js*

```js
const { PluginReadmeList } = require('@dash4/plugin-readme');

async function getConfig() {
  return {
    tabs: [
      {
        title: 'Root',
        rows: [
          [
            new PluginReadmeList({
              files: [
                {
                  title: 'Dash4',
                  file: '../../README.md',
                },
                {
                  title: 'Dash4 - PluginTerminal',
                  file: '../plugin-terminal/README.md',
                },
                {
                  title: 'Dash4 - PluginNpmScripts',
                  file: '../plugin-npm-scripts/README.md',
                },
              ],
            }),
          ],
        ],
      },
    ],
  };
}

module.exports = getConfig;
```

*PluginReadme options:*

```ts
// title of readme list
title?: string;
files: Array<{
  // title of readme file which is displayed under the file preview
  title: string;
  // relative path to the README file
  file: string;
}>;
// grid with per breakpoint
// [12,6,3] means 100% width on small viewports, 50% on medium viewports and 33.3% on large viewports
width?: number[];
```

## <a name="license">License</a>

The @dash4/plugin-readme is [MIT licensed](./LICENSE)

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