'use strict';

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

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _lodash = require('lodash');

var _lodash2 = _interopRequireDefault(_lodash);

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

const imgDefault = require('../../assets/images/wireframes/paragraph.png');
const imgShort = require('../../assets/images/wireframes/short-paragraph.png');
const imgMedia = require('../../assets/images/wireframes/media-paragraph.png');
const imgMediaAlt = require('../../assets/images/wireframes/media-paragraph-alt.png');

const type = {
  default: imgDefault,
  short: imgShort,
  media: imgMedia,
  'media-alt': imgMediaAlt
};

/**
 *
 * @param props.rows number - number of paragraphs to render
 * @param props.type string - type of the paragraphs [default, short, media, media-alt]
 * @returns {XML}
 *
 * Creates dynamically a fake paragraphs filler
 *
 */

const PlaceholderText = props => {
  const typeOfParagraphs = () => type[props.type];

  const renderParagraph = () => {
    const rows = props.rows;
    const rowsArray = [];

    _lodash2.default.times(parseInt(rows, 10), it => {
      rowsArray.push(_react2.default.createElement(
        'div',
        { key: it, style: { padding: '5px' } },
        _react2.default.createElement('img', { src: typeOfParagraphs(), alt: 'Simulate Text' })
      ));
    });

    return rowsArray;
  };

  return _react2.default.createElement(
    'div',
    null,
    renderParagraph()
  );
};

PlaceholderText.propTypes = {
  rows: _react.PropTypes.number,
  // extracting the accept values for the type property.
  type: _react.PropTypes.oneOf(Object.keys(type).map(key => key))
};

PlaceholderText.defaultProps = {
  rows: 1,
  type: 'default'
};

exports.default = PlaceholderText;