@dailybeast/mobiledoc-react-renderer

Mobiledoc renderer that outputs valid react jsx

Stats

StarsIssuesVersionUpdatedCreatedSize
@dailybeast/mobiledoc-react-renderer
1.5.02 years ago4 years agoMinified + gzip package size for @dailybeast/mobiledoc-react-renderer in KB

Readme

Mobiledoc React Renderer

Mobiledoc server and client rendering for Mobiledoc-kit.

This renderer is used across www.thedailybeast.com to perform both client and server rendering of our React app. It supports rendering of markups, atoms, cards and custom sections of any mobiledoc (0.3.0 or greater).

CircleCI

Usage

This renderer is intended to be used from react components, for example:

import PropTypes from 'prop-types';
import { Component } from 'react';
import MobiledocReactRenderer from 'mobiledoc-react-renderer';

const mobiledoc = {
  "atoms": [],
  "cards": [],
  "markups": [],
  "sections": [
    [
      1,
      "p",
      [
        [0, [], 0, "Hello world!"]
      ]
    ]
  ],
  "version": "0.3.0"
};

export default class Mobiledoc extends Component {
  static propTypes = {
    mobiledoc: PropTypes.object.isRequired
  };

  constructor(props) {
    super(props);

    const options = { atoms: [], cards: [], markups: [] };

    this.renderer = new MobiledocReactRenderer(options);
  }

  render() {
    return this.renderer.render(this.props.mobiledoc);
  }
}

Tests

To run the unit tests use: npm test

If you find any bugs or have a feature request, please open an issue on github!

The npm package download data comes from npm's download counts api and package details come from npms.io.