import { __assign, __rest } from "tslib";
import React, { useContext } from 'react';
import classNames from 'classnames';
import warning from '../_utils/warning';
import { ConfigContext } from '../config-provider/config-context';
import { getPrefixCls } from '../_utils/general';
var Flip = function (props) {
    var _a;
    var _b = props.direction, direction = _b === void 0 ? 'horizontal' : _b, _c = props.reverse, reverse = _c === void 0 ? false : _c, customisedCls = props.prefixCls, width = props.width, height = props.height, className = props.className, children = props.children, style = props.style, otherProps = __rest(props, ["direction", "reverse", "prefixCls", "width", "height", "className", "children", "style"]);
    var configContext = useContext(ConfigContext);
    var prefixCls = getPrefixCls('flip', configContext.prefixCls, customisedCls);
    var cls = classNames(prefixCls, className);
    var innerCls = classNames(prefixCls + "__inner", (_a = {},
        _a[prefixCls + "__inner_hor"] = direction === 'horizontal' && !reverse,
        _a[prefixCls + "__inner_hor_reverse"] = direction === 'horizontal' && reverse,
        _a[prefixCls + "__inner_ver"] = direction === 'vertical' && !reverse,
        _a[prefixCls + "__inner_ver_reverse"] = direction === 'vertical' && reverse,
        _a));
    warning(!children || React.Children.count(children) !== 2, 'Children must contain front and back components.', true);
    return (React.createElement("div", __assign({}, otherProps, { className: cls, style: __assign({ width: width, height: height }, style) }),
        React.createElement("div", { className: innerCls }, React.Children.map(children, function (child, index) {
            var _a;
            var childElement = child;
            if (childElement.type.displayName === 'FlipItem') {
                var childProps = {
                    className: classNames((_a = {},
                        _a[prefixCls + "__item-front"] = index === 0,
                        _a[prefixCls + "__item-back"] = index === 1,
                        _a[prefixCls + "__item-back_hor"] = index === 1 && direction === 'horizontal' && !reverse,
                        _a[prefixCls + "__item-back_hor_reverse"] = index === 1 && direction === 'horizontal' && reverse,
                        _a[prefixCls + "__item-back_ver"] = index === 1 && direction === 'vertical' && !reverse,
                        _a[prefixCls + "__item-back_ver_reverse"] = index === 1 && direction === 'vertical' && reverse,
                        _a), child.props.className),
                };
                return React.cloneElement(childElement, childProps);
            }
            else {
                return null;
            }
        }))));
};
Flip.displayName = 'Flip';
export default Flip;
//# sourceMappingURL=flip.js.map