react-mark
v0.0.4
Published
Configurable Markdown Components in React
Downloads
526
Maintainers
Readme
React Mark
Configurable Markdown Components in React. Make your own components to do custom things like to:
- Add line numbers and syntax highlighting to
pre
tags.
- Transform absolute and relative link paths on
a
tags. - Add anchor links to all
h1
andh2
tags.
Install
npm install react-mark --save
Usage
import React from 'react';
import Markdown from 'react-mark';
class Component extends React.Component {
render() {
return <Markdown text="# React Mark"/>;
}
}
class OtherComponent extends React.Component {
render() {
return (
<Markdown replace={{ pre: CodeWithNumbers }}>
import React from 'react';
import Markdown from 'react-mark';
</Markdown>
);
}
}
props
text, children
Type: string
The Markdown to be rendered in React components.
replace
Type: obj
To wrap markdown with a custom component, pass an object down with the element name as the key and the component as the value. Tag names include: a
blockquote
code
del
em
header
hr
img
li
list
p
pre
ref
span
strong
ul
.