text: "use strict";
  
  var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
  
  Object.defineProperty(exports, "__esModule", {
    value: true
  });
  exports.default = NavigationItem;
  
  var _element = require("@wordpress/element");
  
  var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
  
  var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
  
  var _classnames = _interopRequireDefault(require("classnames"));
  
  var _lodash = require("lodash");
  
  var _icons = require("@wordpress/icons");
  
  var _button = _interopRequireDefault(require("../button"));
  
  var _context = require("./context");
  
  var _navigationStyles = require("./styles/navigation-styles");
  
  /**
   * External dependencies
   */
  
  /**
   * WordPress dependencies
   */
  
  /**
   * Internal dependencies
   */
  function NavigationItem(_ref) {
    var badge = _ref.badge,
        children = _ref.children,
        className = _ref.className,
        href = _ref.href,
        item = _ref.item,
        navigateToMenu = _ref.navigateToMenu,
        _ref$onClick = _ref.onClick,
        onClick = _ref$onClick === void 0 ? _lodash.noop : _ref$onClick,
        title = _ref.title,
        props = (0, _objectWithoutProperties2.default)(_ref, ["badge", "children", "className", "href", "item", "navigateToMenu", "onClick", "title"]);
  
    var _useNavigationContext = (0, _context.useNavigationContext)(),
        activeItem = _useNavigationContext.activeItem,
        setActiveItem = _useNavigationContext.setActiveItem,
        setActiveMenu = _useNavigationContext.setActiveMenu;
  
    var classes = (0, _classnames.default)('components-navigation__item', className, {
      'is-active': item && activeItem === item
    });
  
    var onItemClick = function onItemClick() {
      if (navigateToMenu) {
        setActiveMenu(navigateToMenu);
      } else if (!href) {
        setActiveItem(item);
      }
  
      onClick();
    };
  
    return (0, _element.createElement)(_navigationStyles.ItemUI, {
      className: classes
    }, (0, _element.createElement)(_button.default, (0, _extends2.default)({
      href: href,
      onClick: onItemClick
    }, props), title && (0, _element.createElement)(_navigationStyles.ItemTitleUI, {
      className: "components-navigation__item-title",
      variant: "body.small",
      as: "span"
    }, title), children, badge && (0, _element.createElement)(_navigationStyles.ItemBadgeUI, {
      className: "components-navigation__item-badge"
    }, badge), navigateToMenu && (0, _element.createElement)(_icons.Icon, {
      icon: _icons.chevronRight
    })));
  }
  //# sourceMappingURL=item.js.map