"use strict";
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 __());
    };
})();
Object.defineProperty(exports, "__esModule", { value: true });
exports.cssClass = void 0;
var _ = require("lodash");
var classnames = require("classnames");
var MorePropTypes_1 = require("../utils/MorePropTypes");
var React = require("react");
var PropTypes = require("prop-types");
var Button_1 = require("../Button/Button");
var FlexBox_1 = require("../flex/FlexBox");
var Option_1 = require("./Option");
var Type_1 = require("./Type");
require("./Menu.less");
var propTypes = {
    children: MorePropTypes_1.default.oneOrManyOf(MorePropTypes_1.default.instanceOfComponent(Option_1.default)),
    className: PropTypes.string,
    onHide: PropTypes.func.isRequired,
    size: PropTypes.oneOf(_.values(Button_1.Button.Size)),
    type: PropTypes.oneOf(_.values(Type_1.Type)),
};
exports.cssClass = {
    CONTAINER: "DropdownButton--Menu",
    OPTION: "DropdownButton--Option",
    WHITE_BACKGROUND: "DropdownButton--WhiteBackground",
};
var Menu = /** @class */ (function (_super) {
    __extends(Menu, _super);
    function Menu() {
        return _super !== null && _super.apply(this, arguments) || this;
    }
    Menu.prototype._renderOption = function (option) {
        var _a = this.props, onHide = _a.onHide, size = _a.size, type = _a.type;
        var _b = option.props, children = _b.children, className = _b.className, disabled = _b.disabled, href = _b.href, onClick = _b.onClick, target = _b.target;
        // Add the background color back in for the buttons
        var backgroundColorClass = "";
        if (type === Type_1.Type.LINK) {
            backgroundColorClass = exports.cssClass.WHITE_BACKGROUND;
        }
        return (React.createElement(Button_1.Button, { className: classnames(exports.cssClass.OPTION, className, backgroundColorClass), disabled: disabled, href: href, onClick: function (e) {
                onHide();
                if (onClick) {
                    onClick(e);
                }
            }, size: size, target: target, type: type, value: children }));
    };
    Menu.prototype.render = function () {
        var _this = this;
        var _a = this.props, children = _a.children, className = _a.className;
        return (React.createElement(FlexBox_1.default, { className: classnames(exports.cssClass.CONTAINER, className), column: true }, React.Children.map(children, function (option) { return _this._renderOption(option); })));
    };
    Menu.propTypes = propTypes;
    return Menu;
}(React.PureComponent));
exports.default = Menu;
