'use strict';

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

var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _classnames = require('classnames');

var _classnames2 = _interopRequireDefault(_classnames);

var _Toolbar = require('./Toolbar');

var _Toolbar2 = _interopRequireDefault(_Toolbar);

var _Display = require('./Display/Display.propTypes');

var _Display2 = _interopRequireDefault(_Display);

var _DisplayLarge = require('./DisplayLarge');

var _DisplayLarge2 = _interopRequireDefault(_DisplayLarge);

var _DisplayTable = require('./DisplayTable');

var _DisplayTable2 = _interopRequireDefault(_DisplayTable);

var _DisplayTile = require('./DisplayTile');

var _DisplayTile2 = _interopRequireDefault(_DisplayTile);

var _Content = require('./Content');

var _Content2 = _interopRequireDefault(_Content);

var _List = require('./List.scss');

var _List2 = _interopRequireDefault(_List);

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

/**
 * @param {object} props react props
 * @example
const props = {
	displayMode: 'table' / 'large' / 'tile' / component
	list: {
		items: [{}, {}, ...],
		columns: [
			{key, label},
			{key, label},
		]
	},
	toolbar: {
		display: {
			onChange: function,
		},
		sort: {
			field: key,
			options: [
				{key, label},
			],
			isDescending: true / false,
			onChange: function,
		},
		pagination: {
			onChange: function,
			itemsLength: number,
		},
		filter: {
			onFilter: function,
		},
	}
}
<List {...props}></List>
 */
function List(_ref) {
	var id = _ref.id,
	    displayMode = _ref.displayMode,
	    toolbar = _ref.toolbar,
	    list = _ref.list,
	    useContent = _ref.useContent;

	var getDisplayModeComponent = function getDisplayModeComponent() {
		switch (displayMode) {
			case 'tile':
				return _react2.default.createElement(_DisplayTile2.default, _extends({ id: id }, list));
			case 'large':
				return _react2.default.createElement(_DisplayLarge2.default, _extends({ id: id }, list));
			default:
				return _react2.default.createElement(_DisplayTable2.default, _extends({ id: id }, list));
		}
	};
	var getContent = function getContent() {
		return _react2.default.createElement(_Content2.default, _extends({ id: id && id + '-content', displayMode: displayMode }, list));
	};

	var toolbarProps = void 0;
	if (toolbar) {
		toolbarProps = _extends({}, toolbar, { id: id });
		if (toolbar.display) {
			toolbarProps.display.mode = displayMode;
		}
		if (list.itemProps && list.itemProps.isSelected && list.itemProps.onToggleAll) {
			toolbarProps.selectAllCheckbox = {
				id: id,
				items: list.items,
				isSelected: list.itemProps.isSelected,
				onToggleAll: list.itemProps.onToggleAll
			};
		}
	}

	var classnames = (0, _classnames2.default)('tc-list', _List2.default.list);
	return _react2.default.createElement(
		'div',
		{ className: classnames },
		toolbar && _react2.default.createElement(_Toolbar2.default, toolbarProps),
		useContent ? getContent() : getDisplayModeComponent()
	);
}

List.propTypes = {
	id: _react.PropTypes.string,
	displayMode: _react.PropTypes.string,
	list: _react.PropTypes.oneOfType([_react.PropTypes.shape(_Display2.default), _react.PropTypes.shape(_Content2.default.propTypes)]),
	toolbar: _react.PropTypes.shape(_Toolbar2.default.propTypes),
	useContent: _react.PropTypes.bool
};

List.defaultProps = {
	displayMode: 'table',
	useContent: false
};

exports.default = List;