"use strict";
/* This Source Code Form is subject to the terms of the Mozilla Public
 * License, v. 2.0. If a copy of the MPL was not distributed with this
 * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
var __extends = (this && this.__extends) || (function () {
    var extendStatics = function (d, b) {
        extendStatics = Object.setPrototypeOf ||
            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
        return extendStatics(d, b);
    };
    return function (d, b) {
        extendStatics(d, b);
        function __() { this.constructor = d; }
        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
    };
})();
var __assign = (this && this.__assign) || function () {
    __assign = Object.assign || function(t) {
        for (var s, i = 1, n = arguments.length; i < n; i++) {
            s = arguments[i];
            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
                t[p] = s[p];
        }
        return t;
    };
    return __assign.apply(this, arguments);
};
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.Dropdown = void 0;
var react_1 = __importDefault(require("react"));
var bem_react_classname_1 = require("bem-react-classname");
var cn_1 = require("../cn");
var button_1 = __importDefault(require("../button/button"));
var link_1 = __importDefault(require("../link/link"));
var popup_1 = __importDefault(require("../popup/popup"));
var vars_1 = require("../vars");
/**
 * Компонент «выпадашка»: ссылка или кнопка. По клику показывается Popup.
 */
var Dropdown = /** @class */ (function (_super) {
    __extends(Dropdown, _super);
    function Dropdown() {
        var _this = _super !== null && _super.apply(this, arguments) || this;
        _this.cn = bem_react_classname_1.createCn('dropdown');
        _this.state = {
            opened: false,
            switcherHovered: false,
            popupHovered: false,
        };
        _this.handleSwitcherClick = function () {
            // eslint-disable-next-line react/no-access-state-in-setstate
            var newOpenedStatusValue = _this.props.opened === undefined ? !_this.state.opened : !_this.props.opened;
            _this.setState({
                opened: newOpenedStatusValue,
            });
            if (_this.props.onSwitcherClick) {
                _this.props.onSwitcherClick(newOpenedStatusValue);
            }
        };
        _this.handleSwitcherMouseEnter = function (event) {
            _this.setState({ switcherHovered: true });
            if (_this.props.onSwitcherMouseEnter) {
                _this.props.onSwitcherMouseEnter(event);
            }
        };
        _this.handleSwitcherMouseLeave = function (event) {
            _this.setState({ switcherHovered: false });
            if (_this.props.onSwitcherMouseLeave) {
                _this.props.onSwitcherMouseLeave(event);
            }
        };
        _this.handlePopupMouseEnter = function (event) {
            _this.setState({ popupHovered: true });
            if (_this.props.onPopupMouseEnter) {
                _this.props.onPopupMouseEnter(event);
            }
        };
        _this.handlePopupMouseLeave = function (event) {
            _this.setState({ popupHovered: false });
            if (_this.props.onPopupMouseLeave) {
                _this.props.onPopupMouseLeave(event);
            }
        };
        _this.handlePopupClickOutside = function (event) {
            _this.setState({ opened: false });
            if (_this.props.onPopupClickOutside) {
                _this.props.onPopupClickOutside(event);
            }
        };
        return _this;
    }
    Dropdown.prototype.componentDidMount = function () {
        this.popup.setTarget(this.switcher.getNode());
    };
    Dropdown.prototype.render = function () {
        return (react_1.default.createElement("div", { className: this.cn(), id: this.props.id, "data-test-id": this.props['data-test-id'] },
            this.renderSwitcher(),
            this.renderPopup()));
    };
    Dropdown.prototype.renderSwitcher = function () {
        var content = this.props.children || this.props.switcherText;
        var opened = this.props.opened === undefined ? this.state.opened : this.props.opened;
        return this.props.switcherType === 'button'
            ? this.renderSwitcherButton(content, opened)
            : this.renderSwitcherLink(content);
    };
    Dropdown.prototype.renderSwitcherButton = function (content, opened) {
        var _this = this;
        return (react_1.default.createElement(button_1.default, { className: this.cn('switcher'), size: this.props.size, ref: function (switcher) {
                _this.switcher = switcher;
            }, disabled: this.props.disabled, togglable: this.props.togglable /** TODO: разобраться детально */, checked: this.props.togglable === 'check' && opened, onClick: this.props.disabled ? undefined : this.handleSwitcherClick, onMouseEnter: this.handleSwitcherMouseEnter, onMouseLeave: this.handleSwitcherMouseLeave }, content));
    };
    Dropdown.prototype.renderSwitcherLink = function (content) {
        var _this = this;
        return (react_1.default.createElement(link_1.default, { className: this.cn('switcher'), size: this.props.size, ref: function (switcher) {
                _this.switcher = switcher;
            }, disabled: this.props.disabled, pseudo: true, text: content, onClick: this.props.disabled ? undefined : this.handleSwitcherClick, onMouseEnter: this.handleSwitcherMouseEnter, onMouseLeave: this.handleSwitcherMouseLeave }));
    };
    Dropdown.prototype.renderPopup = function () {
        var _this = this;
        var mainOffset;
        var opened = this.props.opened === undefined ? this.state.opened : this.props.opened;
        if (this.props.popupProps === undefined || (this.props.popupProps && this.props.popupProps.type !== 'tooltip')) {
            switch (this.props.size) {
                case 's':
                case 'm':
                    mainOffset = vars_1.POPUP_MAIN_OFFSET / 2;
                    break;
                case 'l':
                case 'xl':
                    mainOffset = vars_1.POPUP_MAIN_OFFSET;
                    break;
            }
        }
        var popupProps = __assign({ className: this.cn('popup'), size: this.props.size, mainOffset: mainOffset }, this.props.popupProps);
        return (react_1.default.createElement(popup_1.default, __assign({}, popupProps, { ref: function (popup) {
                _this.popup = popup;
            }, visible: (!this.props.disabled && opened)
                || (this.props.mode === 'hover' && (this.state.switcherHovered || this.state.popupHovered)), onMouseEnter: this.handlePopupMouseEnter, onMouseLeave: this.handlePopupMouseLeave, onClickOutside: this.handlePopupClickOutside }), this.props.popupContent));
    };
    Dropdown.defaultProps = {
        switcherType: 'link',
        switcherText: 'Switcher',
        disabled: false,
        popupProps: {
            target: 'anchor',
        },
        size: 'm',
    };
    return Dropdown;
}(react_1.default.PureComponent));
exports.Dropdown = Dropdown;
exports.default = cn_1.withTheme(Dropdown);

//# sourceMappingURL=dropdown.js.map
