import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
import _inheritsLoose from "@babel/runtime/helpers/inheritsLoose";
import _defineProperty from "@babel/runtime/helpers/defineProperty";
import React from 'react';
import PropTypes from 'prop-types';
import { Block } from './Block';
import { TabItem } from './TabItem';
import classnames from 'classnames';
import { NavDropdown } from './NavDropdown';
import { Icon } from './Icon';
import { ExternalLink } from './ExternalLink';
export var ToolsMenu =
/*#__PURE__*/
function (_React$Component) {
  _inheritsLoose(ToolsMenu, _React$Component);

  function ToolsMenu() {
    var _this;

    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
      args[_key] = arguments[_key];
    }

    _this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;

    _defineProperty(_assertThisInitialized(_this), "renderMenuItem", function (item) {
      if (_this.props.isExternalLink(item.href)) {
        return React.createElement(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.createElement("span", {
        className: "sr-only"
      }, ", " + _this.props.current) : null;
      return React.createElement(TabItem, {
        role: "menuitem",
        to: item.href,
        key: item.menuTitle,
        testAutomationId: item.menuTitle,
        tabIndex: -1,
        activeKey: item.menuTitle,
        className: classnames({
          active: isCurrentPage
        }),
        onKeyDown: _this.props.onKeyDown,
        onSelect: _this.props.onSelect
      }, item.title, labelForScreenReader);
    });

    _defineProperty(_assertThisInitialized(_this), "renderCategory", function (category) {
      var title = category.title,
          items = category.items,
          id = category.id;
      return React.createElement(Block, {
        key: id + "Category",
        testAutomationId: id + "Category",
        className: "tools-category",
        role: "group",
        "aria-labelledby": id + "CategoryTitle"
      }, React.createElement("legend", {
        "data-test-automation-id": "categoryName",
        className: "tools-category-title",
        id: id + "CategoryTitle"
      }, title), items.map(_this.renderMenuItem));
    });

    _defineProperty(_assertThisInitialized(_this), "renderColumn", function (categories, index) {
      return React.createElement("div", {
        key: "column" + index,
        className: "tools-menu-column"
      }, categories.map(_this.renderCategory));
    });

    return _this;
  }

  var _proto = ToolsMenu.prototype;

  _proto.render = function render() {
    return React.createElement("div", {
      "data-test-automation-id": "toolsMenu",
      className: "tools-menu"
    }, this.props.columns.map(this.renderColumn));
  };

  return ToolsMenu;
}(React.Component);

_defineProperty(ToolsMenu, "contextTypes", {
  router: PropTypes.object
});

_defineProperty(ToolsMenu, "propTypes", {
  columns: PropTypes.array.isRequired,
  onKeyDown: PropTypes.func,
  onSelect: PropTypes.func,
  isExternalLink: PropTypes.func,
  current: PropTypes.string
});

_defineProperty(ToolsMenu, "defaultProps", {
  onKeyDown: function onKeyDown(e) {},
  onSelect: function onSelect(e) {},
  isExternalLink: function isExternalLink(url) {
    return /^(?:https?:)?\/\//.test(url);
  },
  current: 'TRANSLATE:CURRENT'
});

export var ToolsDropdown =
/*#__PURE__*/
function (_React$Component2) {
  _inheritsLoose(ToolsDropdown, _React$Component2);

  function ToolsDropdown() {
    return _React$Component2.apply(this, arguments) || this;
  }

  var _proto2 = ToolsDropdown.prototype;

  _proto2.render = function render() {
    var _this$props = this.props,
        id = _this$props.id,
        title = _this$props.title,
        className = _this$props.className,
        items = _this$props.items,
        isExternalLink = _this$props.isExternalLink;
    var titleElement = React.createElement("span", null, title, React.createElement(Icon, {
      name: "chevron-down-small"
    }));
    return React.createElement(NavDropdown, {
      noCaret: true,
      role: "menu",
      id: id,
      key: id,
      className: className,
      "data-test-automation-id": id,
      activeKey: id,
      title: titleElement
    }, React.createElement(ToolsMenu, {
      columns: items,
      isExternalLink: isExternalLink
    }));
  };

  return ToolsDropdown;
}(React.Component);

_defineProperty(ToolsDropdown, "contextTypes", {
  router: PropTypes.object
});

_defineProperty(ToolsDropdown, "propTypes", {
  title: PropTypes.string.isRequired,
  id: PropTypes.string.isRequired,
  items: PropTypes.array.isRequired,
  className: PropTypes.string,
  isExternalLink: PropTypes.func
});

_defineProperty(ToolsDropdown, "defaultProps", {
  className: '',
  isExternalLink: function isExternalLink(url) {
    return /^(?:https?:)?\/\//.test(url);
  }
});