"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 __());
    };
})();
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
var react_1 = __importDefault(require("react"));
var prop_types_1 = __importDefault(require("prop-types"));
var Block_1 = require("./Block");
var TabItem_1 = require("./TabItem");
var classnames_1 = __importDefault(require("classnames"));
var NavDropdown_1 = require("./NavDropdown");
var Icon_1 = require("./Icon");
var ExternalLink_1 = require("./ExternalLink");
var index_en_US_1 = __importDefault(require("../../lang/common/index-en_US"));
var ToolsMenu = /** @class */ (function (_super) {
    __extends(ToolsMenu, _super);
    function ToolsMenu() {
        var _this = _super !== null && _super.apply(this, arguments) || this;
        _this.renderMenuItem = function (item) {
            if (_this.props.isExternalLink(item.href)) {
                return (react_1.default.createElement(ExternalLink_1.ExternalLink, { id: item.menuTitle, key: item.menuTitle, href: item.href, title: item.title, tabIndex: -1, onClick: item.onClick, role: "menuitem", onKeyDown: _this.props.onKeyDown, withIcon: true }));
            }
            var router = _this.context.router;
            var isCurrentPage = router ? router.isActive(item.href) : false;
            var labelForScreenReader = isCurrentPage ? (react_1.default.createElement("span", { className: "sr-only" }, ", " + _this.props.current)) : null;
            return (react_1.default.createElement(TabItem_1.TabItem, { role: "menuitem", to: item.href, key: item.menuTitle, testAutomationId: item.menuTitle, tabIndex: -1, activeKey: item.menuTitle, className: classnames_1.default({ active: isCurrentPage }), onKeyDown: _this.props.onKeyDown, onSelect: _this.props.onSelect },
                item.title,
                labelForScreenReader));
        };
        _this.renderCategory = function (category) {
            var title = category.title, items = category.items, id = category.id;
            return (react_1.default.createElement(Block_1.Block, { key: id + "Category", testAutomationId: id + "Category", className: "tools-category", role: "group", "aria-labelledby": id + "CategoryTitle" },
                react_1.default.createElement("legend", { "data-test-automation-id": "categoryName", className: "tools-category-title", id: id + "CategoryTitle" }, title),
                items.map(_this.renderMenuItem)));
        };
        _this.renderColumn = function (categories, index) {
            return (react_1.default.createElement("div", { key: "column" + index, className: "tools-menu-column" }, categories.map(_this.renderCategory)));
        };
        return _this;
    }
    ToolsMenu.prototype.render = function () {
        return (react_1.default.createElement("div", { "data-test-automation-id": "toolsMenu", className: "tools-menu" }, this.props.columns.map(this.renderColumn)));
    };
    ToolsMenu.contextTypes = {
        router: prop_types_1.default.object
    };
    ToolsMenu.propTypes = {
        columns: prop_types_1.default.array.isRequired,
        onKeyDown: prop_types_1.default.func,
        onSelect: prop_types_1.default.func,
        isExternalLink: prop_types_1.default.func,
        current: prop_types_1.default.string
    };
    ToolsMenu.defaultProps = {
        onKeyDown: function (e) { },
        onSelect: function (e) { },
        isExternalLink: function (url) { return /^(?:https?:)?\/\//.test(url); },
        get current() {
            return index_en_US_1.default.CURRENT;
        }
    };
    return ToolsMenu;
}(react_1.default.Component));
exports.ToolsMenu = ToolsMenu;
var ToolsDropdown = /** @class */ (function (_super) {
    __extends(ToolsDropdown, _super);
    function ToolsDropdown() {
        return _super !== null && _super.apply(this, arguments) || this;
    }
    ToolsDropdown.prototype.render = function () {
        var _a = this.props, id = _a.id, title = _a.title, className = _a.className, items = _a.items, isExternalLink = _a.isExternalLink;
        var titleElement = (react_1.default.createElement("span", null,
            title,
            react_1.default.createElement(Icon_1.Icon, { name: "chevron-down-small" })));
        var NavDropdownTS = NavDropdown_1.NavDropdown;
        return (react_1.default.createElement(NavDropdownTS, { noCaret: true, role: "menu", id: id, key: id, className: className, "data-test-automation-id": id, activeKey: id, title: titleElement },
            react_1.default.createElement(ToolsMenu, { columns: items, isExternalLink: isExternalLink })));
    };
    ToolsDropdown.contextTypes = {
        router: prop_types_1.default.object
    };
    ToolsDropdown.propTypes = {
        title: prop_types_1.default.string.isRequired,
        id: prop_types_1.default.string.isRequired,
        items: prop_types_1.default.array.isRequired,
        className: prop_types_1.default.string,
        isExternalLink: prop_types_1.default.func
    };
    ToolsDropdown.defaultProps = {
        className: '',
        isExternalLink: function (url) { return /^(?:https?:)?\/\//.test(url); }
    };
    return ToolsDropdown;
}(react_1.default.Component));
exports.ToolsDropdown = ToolsDropdown;
//# sourceMappingURL=ToolsMenu.js.map