# @patternfly/pfe-markdown

> Markdown element for PatternFly Elements

Latest version **1.12.3** (published 2022-02-01) · MIT license · 0 weekly downloads

## Install

```sh
npm install @patternfly/pfe-markdown
pnpm add @patternfly/pfe-markdown
yarn add @patternfly/pfe-markdown
bun add @patternfly/pfe-markdown
```

## Health

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

Positive: esm support; no vulnerabilities; high maintenance score.

Warnings: low downloads; no types.

Negative: abandoned.

## Facts

| | |
|---|---|
| Version | 1.12.3 |
| Published | 2022-02-01 |
| First published | 2019-05-31 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | ESM + CommonJS |
| Dependencies | 2 |
| Unpacked size | 725 KB |
| Known vulnerabilities | 0 (+2 in 1 direct dependencies) |
| Install scripts | no |
| GitHub stars | 397 |
| Maintainers | ctrowbri, dgutride, dlabrecq, patternfly-build, jeff-phillips-18, mturley, mwcz, kylebuch8, realredallen, ktotten, evwilkin, schulj12, castastrophe, nicolethoen, heymp, zhawkins |

## Links

- npm: https://www.npmjs.com/package/@patternfly/pfe-markdown
- Repository: https://github.com/patternfly/patternfly-elements
- Homepage: https://github.com/patternfly/patternfly-elements#readme
- Issues: https://github.com/patternfly/patternfly-elements/issues
- npm.io page: https://npm.io/package/@patternfly/pfe-markdown

## Dependencies (2)

- [marked](https://npm.io/package/marked.md) ^2.0.1
- [@patternfly/pfelement](https://npm.io/package/@patternfly/pfelement.md) ^1.12.3

## Recent versions

- 1.12.3 (latest) — 2022-02-01
- 2.0.0-next.3 (next) — 2022-08-23
- 2.0.0-next.2 — 2022-04-18
- 2.0.0-next.1 — 2022-03-23
- 2.0.0-next.0 — 2022-02-23
- 1.12.2 — 2021-11-16
- 1.12.1 — 2021-11-16
- 1.12.0 — 2021-11-12
- 1.11.2 — 2021-09-29
- 1.11.1 — 2021-09-03
- 1.11.0 — 2021-08-18
- 1.10.1 — 2021-07-12
- 1.10.0 — 2021-07-08
- 1.9.3 — 2021-06-16
- 1.9.2 — 2021-06-01
- … 48 more at https://npm.io/package/@patternfly/pfe-markdown/versions

## README

# PatternFly Element | Markdown Element

Use this element to take markdown and have it display as HTML. This element uses the [marked.js library](https://marked.js.org/#/README.md#README.md) to convert the markdown to HTML.

## Usage

```
<pfe-markdown>
  <div pfe-markdown-container># This is a heading</div>
</pfe-markdown>
```

It is important that the div with the `pfe-markdown-container` attribute is present. Without it, the element won't work. This element does not actually use the shadow DOM to display it's contents.

At runtime, a child div with an attribute of `pfe-markdown-render` is appended to the light DOM and the `pfe-markdown-container` div is hidden with an inline style. The purpose behind this is so that all of the styles that are present in the light DOM are available to the converted markdown.

## Slots

There is a default slot but it is just used to capture the light DOM and hide it.

## Attributes

None.

## Test

    npm run test

## Build

    npm run build

## Demo

From the PFElements root directory, run:

    npm start

## Code style

Accordion (and all PFElements) use [Prettier][prettier] to auto-format JS and JSON. The style rules get applied when you commit a change. If you choose to, you can [integrate your editor][prettier-ed] with Prettier to have the style rules applied on every save.

[prettier]: https://github.com/prettier/prettier/
[prettier-ed]: https://github.com/prettier/prettier/#editor-integration
[web-component-tester]: https://github.com/Polymer/web-component-tester

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