'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 _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();

exports.cancelActionComponent = cancelActionComponent;

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _reactCssTransition = require('react-css-transition');

var _classnames3 = require('classnames');

var _classnames4 = _interopRequireDefault(_classnames3);

var _ActionBar = require('../ActionBar');

var _ActionBar2 = _interopRequireDefault(_ActionBar);

var _Action = require('../Actions/Action');

var _Action2 = _interopRequireDefault(_Action);

var _TabBar = require('../TabBar');

var _TabBar2 = _interopRequireDefault(_TabBar);

var _Drawer = require('./Drawer.scss');

var _Drawer2 = _interopRequireDefault(_Drawer);

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

function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return 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; }

function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }

function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }

var DrawerAnimation = function (_React$Component) {
	_inherits(DrawerAnimation, _React$Component);

	function DrawerAnimation(props) {
		_classCallCheck(this, DrawerAnimation);

		var _this = _possibleConstructorReturn(this, (DrawerAnimation.__proto__ || Object.getPrototypeOf(DrawerAnimation)).call(this, props));

		_this.handleTransitionComplete = _this.handleTransitionComplete.bind(_this);
		_this.state = { transitioned: false };
		return _this;
	}

	_createClass(DrawerAnimation, [{
		key: 'handleTransitionComplete',
		value: function handleTransitionComplete() {
			this.props.onTransitionComplete();
			this.setState({ transitioned: true });
		}
	}, {
		key: 'render',
		value: function render() {
			var _props = this.props,
			    children = _props.children,
			    rest = _objectWithoutProperties(_props, ['children']);

			return _react2.default.createElement(
				_reactCssTransition.CSSTransition,
				_extends({}, rest, {
					onTransitionComplete: this.handleTransitionComplete,
					defaultStyle: { transform: 'translateX(100%)' },
					enterStyle: { transform: (0, _reactCssTransition.transit)('translateX(0%)', 350, 'ease-in-out') },
					leaveStyle: { transform: (0, _reactCssTransition.transit)('translateX(100%)', 350, 'ease-in-out') },
					activeStyle: { transform: 'translateX(0%)' }
				}),
				_react2.default.cloneElement(children, this.state)
			);
		}
	}]);

	return DrawerAnimation;
}(_react2.default.Component);

DrawerAnimation.propTypes = {
	children: _react.PropTypes.node,
	onTransitionComplete: _react.PropTypes.func
};
DrawerAnimation.defaultProps = {
	onTransitionComplete: function onTransitionComplete() {}
};

function DrawerContainer(_ref) {
	var _classnames, _classnames2;

	var stacked = _ref.stacked,
	    className = _ref.className,
	    children = _ref.children,
	    _ref$withTransition = _ref.withTransition,
	    withTransition = _ref$withTransition === undefined ? true : _ref$withTransition,
	    rest = _objectWithoutProperties(_ref, ['stacked', 'className', 'children', 'withTransition']);

	var drawerContainerClasses = (0, _classnames4.default)(_Drawer2.default['tc-drawer'], className, 'tc-drawer', (_classnames = {}, _defineProperty(_classnames, _Drawer2.default['tc-drawer-transition'], withTransition), _defineProperty(_classnames, 'tc-drawer-transition', withTransition), _classnames), (_classnames2 = {}, _defineProperty(_classnames2, _Drawer2.default['drawer-stacked'], stacked), _defineProperty(_classnames2, 'stacked', stacked), _classnames2));
	return _react2.default.createElement(
		'div',
		_extends({ className: drawerContainerClasses }, rest),
		_react2.default.createElement(
			'div',
			{ className: _Drawer2.default['tc-drawer-container'] },
			children
		)
	);
}

DrawerContainer.propTypes = {
	stacked: _react.PropTypes.bool,
	withTransition: _react.PropTypes.bool,
	className: _react.PropTypes.string,
	children: _react.PropTypes.node.isRequired
};

function cancelActionComponent(onCancelAction) {
	if (!onCancelAction) {
		return null;
	}
	var enhancedCancelAction = _extends({
		icon: 'talend-cross',
		hideLabel: true,
		link: true
	}, onCancelAction);
	return _react2.default.createElement(_Action2.default, _extends({ className: _Drawer2.default['tc-drawer-close-action'] }, enhancedCancelAction));
}

function DrawerTitle(_ref2) {
	var title = _ref2.title,
	    children = _ref2.children,
	    onCancelAction = _ref2.onCancelAction;

	if (!title) {
		return null;
	}
	return _react2.default.createElement(
		'div',
		null,
		_react2.default.createElement(
			'div',
			{ className: _Drawer2.default['tc-drawer-header'] },
			_react2.default.createElement(
				'h1',
				null,
				title
			),
			cancelActionComponent(onCancelAction)
		),
		_react2.default.createElement(
			'div',
			{ className: _Drawer2.default['tc-drawer-header-with-tabs'] },
			children
		)
	);
}

DrawerTitle.propTypes = {
	title: _react.PropTypes.string.isRequired,
	onCancelAction: _react.PropTypes.shape(_Action2.default.propTypes),
	children: _react.PropTypes.node
};

function DrawerContent(_ref3) {
	var children = _ref3.children,
	    rest = _objectWithoutProperties(_ref3, ['children']);

	return _react2.default.createElement(
		'div',
		_extends({ className: _Drawer2.default['tc-drawer-content'] }, rest),
		children
	);
}

DrawerContent.propTypes = {
	children: _react.PropTypes.node
};

function DrawerFooter(_ref4) {
	var children = _ref4.children;

	return _react2.default.createElement(
		'div',
		{ className: _Drawer2.default['tc-drawer-footer'] },
		children
	);
}

DrawerFooter.propTypes = {
	children: _react.PropTypes.node
};

function combinedFooterActions(onCancelAction, footerActions) {
	if (!onCancelAction) {
		return footerActions;
	}
	var enhancedFooterActions = _extends({}, footerActions);
	if (footerActions && footerActions.actions && footerActions.actions.left) {
		enhancedFooterActions.actions.left.push(onCancelAction);
	} else {
		enhancedFooterActions.actions.left = [].push(onCancelAction);
	}
	return enhancedFooterActions;
}

function Drawer(_ref5) {
	var stacked = _ref5.stacked,
	    title = _ref5.title,
	    className = _ref5.className,
	    style = _ref5.style,
	    children = _ref5.children,
	    footerActions = _ref5.footerActions,
	    onCancelAction = _ref5.onCancelAction,
	    tabs = _ref5.tabs,
	    _ref5$withTransition = _ref5.withTransition,
	    withTransition = _ref5$withTransition === undefined ? true : _ref5$withTransition;

	if (!children) {
		return null;
	}
	return _react2.default.createElement(
		DrawerContainer,
		{
			stacked: stacked,
			className: className,
			style: style,
			withTransition: withTransition
		},
		_react2.default.createElement(DrawerTitle, { title: title, onCancelAction: onCancelAction }),
		tabs && _react2.default.createElement(_TabBar2.default, tabs),
		_react2.default.createElement(
			'div',
			{ style: { display: 'flex', flexDirection: 'column', flexGrow: 1, overflow: 'hidden' } },
			_react2.default.createElement(
				DrawerContent,
				null,
				children
			),
			_react2.default.createElement(_ActionBar2.default, combinedFooterActions(onCancelAction, footerActions))
		)
	);
}

Drawer.propTypes = {
	stacked: _react.PropTypes.bool,
	title: _react.PropTypes.string,
	children: _react.PropTypes.node,
	style: _react.PropTypes.object, // eslint-disable-line react/forbid-prop-types
	className: _react.PropTypes.string,
	// footer action, see action bar for api
	footerActions: _react.PropTypes.shape(_ActionBar2.default.propTypes).isRequired,
	onCancelAction: _react.PropTypes.shape(_Action2.default.propTypes),
	tabs: _react.PropTypes.shape(_TabBar2.default.propTypes),
	withTransition: _react.PropTypes.bool
};

Drawer.Animation = DrawerAnimation;
Drawer.Container = DrawerContainer;
Drawer.Title = DrawerTitle;
Drawer.Content = DrawerContent;
Drawer.Footer = DrawerFooter;
Drawer.FooterStyle = _Drawer2.default['tc-drawer-footer'];

exports.default = Drawer;