Skip to content
No description, website, or topics provided.
HTML JavaScript CSS
Branch: master
Clone or download
Latest commit 3da7a60 May 17, 2018
Type Name Latest commit message Commit time
Failed to load latest commit information.
config New build and release Apr 25, 2018
dist Merge branch 'master' into master May 17, 2018
public initial commit Dec 17, 2016
src Merge branch 'master' into feature/style-support May 17, 2018
.babelrc initial commit Dec 17, 2016
.gitignore New build and release Apr 25, 2018
LICENSE upgrading dependencies Jan 12, 2017 Simple no-die test, updated README Mar 23, 2018
package-lock.json updating yarn.lock May 17, 2018
package.json Merge branch 'master' into upstream-preserve-indentation May 17, 2018


A library for converting plain HTML to DraftJS Editor content. Build for use with react-draft-wysiwyg.


npm install html-to-draftjs --save


import { EditorState, ContentState } from 'draft-js';
import htmlToDraft from 'html-to-draftjs';

const blocksFromHtml = htmlToDraft(this.props.content);
const { contentBlocks, entityMap } = blocksFromHtml;
const contentState = ContentState.createFromBlockArray(contentBlocks, entityMap);
const editorState = EditorState.createWithContent(contentState);

(optional) customChunkRenderer

Use to define additional html nodes. Only supports atomic blocks.

  • nodeName: string - the name of the node, in lowercase
  • node: HTMLElement - the parsed node itself

This renderer function is executed before any other html to draft conversion. Return nothing (or something falsy) to continue with the normal translation.


htmlToDraft('<hr/>', (nodeName, node) => {
  if (nodeName === 'hr') {
    return {
      type: 'HORIZONTAL_RULE',
      mutability: 'MUTABLE',
      data: {}

Take Care: Plz not use version 1.2.0 it has build issues.

You can’t perform that action at this time.