@scrnhq/eurovision-elements/editor/view/index.js

'use strict';

Object.defineProperty(exports, "__esModule", {
  value: true
});

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _styleMap = require('../style-map');

var _styleMap2 = _interopRequireDefault(_styleMap);

var _decorators = require('../decorators');

var _decorators2 = _interopRequireDefault(_decorators);

var _component = require('../component');

var _component2 = _interopRequireDefault(_component);

var _blocks = require('../blocks');

var _blockRenderMap = require('../block-render-map');

var _blockRenderMap2 = _interopRequireDefault(_blockRenderMap);

var _draftJs = require('draft-js');

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

function blockRenderer(draftBlock) {
  if (draftBlock.getType() !== 'atomic') return null;
  var data = draftBlock.getData().toObject();
  var blockData = _blocks.blocks.find(function (block) {
    return block.type === data.type;
  });

  if (blockData) {
    return {
      component: _blocks.BaseBlock,
      editable: false,
      props: { blockData: blockData }
    };
  }

  return false;
}

/**
 * Composite the decorators.
 *
 * @return {CompositeDecorator}
 */
function getDecorators() {
  return new _draftJs.CompositeDecorator(_decorators2.default);
}

var EditorView = function EditorView(_ref) {
  var raw = _ref.raw;

  var contentState = (0, _draftJs.convertFromRaw)(raw);
  var editorState = _draftJs.EditorState.createWithContent(contentState, getDecorators());

  return _react2.default.createElement(
    _component2.default,
    null,
    _react2.default.createElement(_draftJs.Editor, {
      editorState: editorState,
      customStyleMap: _styleMap2.default,
      blockRenderMap: _blockRenderMap2.default,
      blockRendererFn: blockRenderer,
      readOnly: true
    })
  );
};

EditorView.propTypes = {
  raw: _react.PropTypes.shape().isRequired
};

exports.default = EditorView;