diff --git a/README.md b/README.md
index c87e1c7..607d066 100644
--- a/README.md
+++ b/README.md
@@ -13,6 +13,7 @@ npm install --save react-remarkable
var React = require('react');
var Markdown = require('react-remarkable');
+var Emoji = require('remarkable-emoji');
var MyComponent = React.createClass({
@@ -20,7 +21,7 @@ var MyComponent = React.createClass({
return (
{/* Pass Markdown source to the `source` prop */}
-
+
{/* Or pass it as children */}
{/* You can nest React components, too */}
@@ -47,6 +48,7 @@ Available props:
- `options` - Hash of Remarkable options
- `source` - Markdown source. You can also pass the source as children, which allows you to mix React components and Markdown.
- `container` - Element to use as container. Defaults to `div`.
+- `plugins` - Array of remarkable plugins
## Syntax Highlighting
diff --git a/src/index.js b/src/index.js
index 46c7336..4a128b9 100644
--- a/src/index.js
+++ b/src/index.js
@@ -17,7 +17,7 @@ class Remarkable extends React.Component {
componentWillUpdate(nextProps, nextState) {
if (nextProps.options !== this.props.options) {
- this.md = new Markdown(nextProps.options);
+ this.md = this.createMarkdown(nextProps.options, nextProps.plugins);
}
}
@@ -39,16 +39,23 @@ class Remarkable extends React.Component {
renderMarkdown(source) {
if (!this.md) {
- this.md = new Markdown(this.props.options);
+ this.md = this.createMarkdown(this.props.options, this.props.plugins);
}
return this.md.render(source);
}
+
+ createMarkdown(options, plugins) {
+ return plugins.reduce((md, plugin) => {
+ return md.use(plugin);
+ }, new Markdown(options));
+ }
}
Remarkable.defaultProps = {
container: 'div',
options: {},
+ plugins: [],
};
export default Remarkable;