"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = exports.VerticalNavItemLabel = void 0;

var _propTypes = _interopRequireDefault(require("prop-types"));

var _react = _interopRequireDefault(require("react"));

var _classnames = _interopRequireDefault(require("classnames"));

var _Icons = require("../Icons");

var _i18n = require("../i18n");

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }

var DEFAULT_COMPONENT_TYPE = 'div';

var VerticalNavItemLabel = function VerticalNavItemLabel(props) {
  /**
   * The type of element rendered ultimately depends on whether
   * this is meant to be a subnav toggle, link, or generic label
   * @return {String} The type of HTML tag
   */
  var componentType = function componentType() {
    if (props.hasSubnav) {
      return 'button';
    } else if (props.component) {
      return props.component;
    } else if (props.url) {
      return 'a';
    }

    return DEFAULT_COMPONENT_TYPE;
  };

  var LabelComponent = componentType();

  var handleClick = function handleClick(evt) {
    return props.onClick(evt);
  };

  var commonProps = {
    className: (0, _classnames.default)('ds-c-vertical-nav__label', {
      'ds-c-vertical-nav__label--current': props.selected,
      'ds-c-vertical-nav__label--parent': props.hasSubnav
    }),
    onClick: props.onClick ? handleClick : undefined
  };
  var otherProps;

  if (LabelComponent === 'button') {
    var _props$ariaCollapsedS, _props$ariaExpandedSt;

    var collapsedLabel = (_props$ariaCollapsedS = props.ariaCollapsedStateButtonLabel) !== null && _props$ariaCollapsedS !== void 0 ? _props$ariaCollapsedS : (0, _i18n.t)('verticalNav.expand');
    var expandedLabel = (_props$ariaExpandedSt = props.ariaExpandedStateButtonLabel) !== null && _props$ariaExpandedSt !== void 0 ? _props$ariaExpandedSt : (0, _i18n.t)('verticalNav.collapse');
    otherProps = {
      'aria-controls': props.subnavId,
      'aria-expanded': !props.collapsed,
      title: props.collapsed ? collapsedLabel : expandedLabel
    };
  } else if (LabelComponent !== DEFAULT_COMPONENT_TYPE) {
    // Apply href if <a> or custom component type
    otherProps = {
      'aria-current': props.selected,
      href: props.url
    };
  }

  return /*#__PURE__*/_react.default.createElement(LabelComponent, _extends({}, commonProps, otherProps), props.label, props.hasSubnav && /*#__PURE__*/_react.default.createElement(_Icons.ArrowIcon, {
    direction: props.collapsed ? 'down' : 'up'
  }));
};

exports.VerticalNavItemLabel = VerticalNavItemLabel;
VerticalNavItemLabel.propTypes = {
  ariaCollapsedStateButtonLabel: _propTypes.default.string,
  ariaExpandedStateButtonLabel: _propTypes.default.string,
  collapsed: _propTypes.default.bool,
  component: _propTypes.default.any,
  hasSubnav: _propTypes.default.bool,
  label: _propTypes.default.node.isRequired,
  onClick: _propTypes.default.func,
  selected: _propTypes.default.bool,
  subnavId: _propTypes.default.string.isRequired,
  url: _propTypes.default.string
};
var _default = VerticalNavItemLabel;
exports.default = _default;