'use strict';

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

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _reactBootstrap = require('react-bootstrap');

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

function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }

var TITLE_MODE_TEXT = 'text';
var TITLE_MODE_INPUT = 'input';
var TITLE_MODE_BUTTON = 'button';

var ESC_KEY = 27;
var ENTER_KEY = 13;

function TitleText(_ref) {
	var id = _ref.id,
	    value = _ref.value;

	return _react2.default.createElement(
		'div',
		{ id: id, className: 'tc-list-item-title-text' },
		value
	);
}

TitleText.propTypes = {
	id: _react2.default.PropTypes.string,
	value: _react2.default.PropTypes.string.isRequired
};

function TitleButton(_ref2) {
	var id = _ref2.id,
	    value = _ref2.value,
	    onClick = _ref2.onClick;

	return _react2.default.createElement(
		_reactBootstrap.Button,
		{
			id: id,
			title: value,
			onClick: onClick,
			role: 'link',
			bsStyle: 'link'
		},
		value
	);
}

TitleButton.propTypes = {
	id: _react2.default.PropTypes.string,
	value: _react2.default.PropTypes.string.isRequired,
	onClick: _react2.default.PropTypes.func.isRequired
};

function TitleInput(_ref3) {
	var id = _ref3.id,
	    value = _ref3.value,
	    onChange = _ref3.onChange,
	    onSubmit = _ref3.onSubmit,
	    onCancel = _ref3.onCancel;

	var onKeyUp = function onKeyUp(event) {
		switch (event.keyCode) {
			case ESC_KEY:
				onCancel(event);
				break;
			case ENTER_KEY:
				onSubmit(event);
				break;
			default:
				break;
		}
	};
	return _react2.default.createElement('input', {
		type: 'text',
		id: id,
		className: 'tc-list-item-title-input',
		value: value,
		onChange: onChange,
		onKeyUp: onKeyUp,
		onBlur: onSubmit,
		autoFocus: true
	});
}

TitleInput.propTypes = {
	id: _react2.default.PropTypes.string,
	value: _react2.default.PropTypes.string.isRequired,
	onChange: _react2.default.PropTypes.func.isRequired,
	onSubmit: _react2.default.PropTypes.func.isRequired,
	onCancel: _react2.default.PropTypes.func.isRequired
};

/**
 * Item title component
 * @param {object} props item title configuration props
 * @example
 const props = {
	id: 'my-title',
	value: 'My Title',
	display: 'text',              // 'text' | 'button' | 'input'
	onClick: (event) => {},       // button mode click callback
	onChange: (event) => {},      // input mode change callback
	onSubmit: (event) => {},      // input mode validation callback
	onCancel: (event) => {},      // input mode cancellation callback
	}
 }
 <ItemTitle {...props} />
 */
function ItemTitle(props) {
	var display = props.display,
	    rest = _objectWithoutProperties(props, ['display']);

	var getTitleElement = function getTitleElement() {
		switch (display) {
			case TITLE_MODE_TEXT:
				return _react2.default.createElement(TitleText, rest);
			case TITLE_MODE_BUTTON:
				return _react2.default.createElement(TitleButton, rest);
			case TITLE_MODE_INPUT:
				return _react2.default.createElement(TitleInput, rest);
			default:
				return null;
		}
	};

	return _react2.default.createElement(
		'div',
		{ className: 'tc-list-item-title' },
		getTitleElement()
	);
}

ItemTitle.propTypes = {
	id: _react2.default.PropTypes.string,
	value: _react2.default.PropTypes.string.isRequired,
	display: _react2.default.PropTypes.oneOf([TITLE_MODE_TEXT, TITLE_MODE_BUTTON, TITLE_MODE_INPUT]),
	onClick: _react2.default.PropTypes.func,
	onChange: _react2.default.PropTypes.func,
	onSubmit: _react2.default.PropTypes.func,
	onCancel: _react2.default.PropTypes.func
};

ItemTitle.defaultProps = {
	display: TITLE_MODE_TEXT
};

exports.default = ItemTitle;