Nearly Picked Makefiles

    awfe-draft-js-export-html

    0.4.0 • Public • Published

    DraftJS: Export ContentState to HTML

    This is a module for DraftJS that will export your editor content to semantic HTML.

    It was extracted from React-RTE and placed into a separate module for more general use. Hopefully it can be helpful in your projects.

    Installation

    npm install --save draft-js-export-html
    

    How to Use

    import {stateToHTML} from 'draft-js-export-html';
    let html = stateToHTML(contentState);

    Options

    You can optionally pass a second "options" argument to stateToHTML which should be an object with one or more of the following properties:

    inlineStyles

    You can define rendering options for inline styles. This applies to built-in inline styles (e.g. BOLD) or your own custom inline styles (e.g. RED). You can specify which element/tag name will be used (e.g. use <b> instead of <strong> for BOLD). You can add custom attributes (e.g. class="foo") or add some styling (e.g. color: red).

    Example:

    let options = {
      inlineStyles: {
        // Override default element (`strong`).
        BOLD: {element: 'b'},
        ITALIC: {
          // Add custom attributes. You can also use React-style `className`.
          attributes: {class: 'foo'},
          // Use camel-case. Units (`px`) will be added where necessary.
          style: {fontSize: 12}
        },
        // Use a custom inline style. Default element is `span`.
        RED: {style: {color: '#900'}},
      },
    };
    let html = stateToHTML(contentState, options);

    blockRenderers

    You can define a custom renderer for any block type. Pass a function that accepts block as an argument. You can return a string to render this block yourself, or return nothing (null or undefined) to defer to the default renderer.

    Example:

    let options = {
      blockRenderers: {
        ATOMIC: (block) => {
          let data = block.getData();
          if (data.foo === 'bar') {
            return '<div>' + escape(block.getText()) + '</div>';
          }
        },
      },
    };
    let html = stateToHTML(contentState, options);

    Contributing

    If you want to help out, please open an issue to discuss or join us on Slack.

    License

    This software is BSD Licensed.

    Install

    npm i awfe-draft-js-export-html

    DownloadsWeekly Downloads

    6

    Version

    0.4.0

    License

    ISC

    Last publish

    Collaborators

    • osdream