'use strict';

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

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _classnames = require('classnames');

var _classnames2 = _interopRequireDefault(_classnames);

var _gridrow = require('../utils/gridrow');

var _RowThemes = require('./RowThemes');

var _RowThemes2 = _interopRequireDefault(_RowThemes);

var _RowLarge = require('./RowLarge.scss');

var _RowLarge2 = _interopRequireDefault(_RowLarge);

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

/**
 * Row renderer that displays a Large item
 */
function RowLarge(_ref) {
	var className = _ref.className,
	    index = _ref.index,
	    key = _ref.key,
	    parent = _ref.parent,
	    style = _ref.style;

	var _extractSpecialFields = (0, _gridrow.extractSpecialFields)(parent),
	    titleField = _extractSpecialFields.titleField,
	    selectionField = _extractSpecialFields.selectionField,
	    otherFields = _extractSpecialFields.otherFields;

	var parentId = (0, _gridrow.getId)(parent);
	var id = parentId && parentId + '-' + index;
	var titleCell = titleField && (0, _gridrow.renderCell)(index, parent, titleField);
	var selectionCell = selectionField && (0, _gridrow.renderCell)(index, parent, selectionField);
	var otherCellsListItems = otherFields.map(function (field, fieldIndex) {
		var cellContent = (0, _gridrow.renderCell)(index, parent, field);
		var tooltip = typeof cellContent === 'string' ? cellContent : null;
		var label = (0, _gridrow.getLabel)(field);
		return _react2.default.createElement(
			'li',
			{ key: fieldIndex },
			label && _react2.default.createElement(
				'span',
				{ className: _RowLarge2.default['field-label'] },
				label,
				': '
			),
			_react2.default.createElement(
				'span',
				{ className: _RowLarge2.default['field-value'], title: tooltip },
				cellContent
			)
		);
	});

	return _react2.default.createElement(
		'div',
		{
			className: (0, _classnames2.default)(_RowThemes2.default),
			key: key,
			style: style
		},
		_react2.default.createElement(
			'div',
			{
				className: 'tc-list-large-row ' + _RowLarge2.default['inner-box'] + ' ' + className,
				id: id
			},
			_react2.default.createElement(
				'div',
				{ className: _RowLarge2.default.header },
				titleCell,
				selectionCell
			),
			_react2.default.createElement(
				'ul',
				{ className: _RowLarge2.default.content },
				otherCellsListItems
			)
		)
	);
}

RowLarge.displayName = 'VirtualizedList(RowLarge)';
RowLarge.propTypes = {
	/** Custom classname to set on the row */
	className: _react.PropTypes.string,
	/** Row index */
	index: _react.PropTypes.number,
	/** Row technical key to identify this row for React consolidation */
	key: _react.PropTypes.string,
	/** Parent (ListGrid) component instance */
	parent: _react.PropTypes.object, // eslint-disable-line react/forbid-prop-types
	/** Custom style that react-virtualized provides */
	style: _react.PropTypes.object // eslint-disable-line react/forbid-prop-types
};

exports.default = RowLarge;