"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.NavigationItem = NavigationItem;
exports.default = void 0;
var _clsx = _interopRequireDefault(require("clsx"));
var _icons = require("@wordpress/icons");
var _i18n = require("@wordpress/i18n");
var _button = _interopRequireDefault(require("../../button"));
var _context = require("../context");
var _navigationStyles = require("../styles/navigation-styles");
var _baseContent = _interopRequireDefault(require("./base-content"));
var _base = _interopRequireDefault(require("./base"));
var _jsxRuntime = require("react/jsx-runtime");
/**
 * External dependencies
 */

/**
 * WordPress dependencies
 */

/**
 * Internal dependencies
 */

const noop = () => {};

/**
 * @deprecated Use `Navigator` instead.
 */
function NavigationItem(props) {
  const {
    badge,
    children,
    className,
    href,
    item,
    navigateToMenu,
    onClick = noop,
    title,
    icon,
    hideIfTargetMenuEmpty,
    isText,
    ...restProps
  } = props;
  const {
    activeItem,
    setActiveMenu,
    navigationTree: {
      isMenuEmpty
    }
  } = (0, _context.useNavigationContext)();

  // If hideIfTargetMenuEmpty prop is true
  // And the menu we are supposed to navigate to
  // Is marked as empty, then we skip rendering the item.
  if (hideIfTargetMenuEmpty && navigateToMenu && isMenuEmpty(navigateToMenu)) {
    return null;
  }
  const isActive = item && activeItem === item;
  const classes = (0, _clsx.default)(className, {
    'is-active': isActive
  });
  const onItemClick = event => {
    if (navigateToMenu) {
      setActiveMenu(navigateToMenu);
    }
    onClick(event);
  };
  const navigationIcon = (0, _i18n.isRTL)() ? _icons.chevronLeft : _icons.chevronRight;
  const baseProps = children ? props : {
    ...props,
    onClick: undefined
  };
  const itemProps = isText ? restProps : {
    as: _button.default,
    href,
    onClick: onItemClick,
    'aria-current': isActive ? 'page' : undefined,
    ...restProps
  };
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_base.default, {
    ...baseProps,
    className: classes,
    children: children || /*#__PURE__*/(0, _jsxRuntime.jsxs)(_navigationStyles.ItemUI, {
      ...itemProps,
      children: [icon && /*#__PURE__*/(0, _jsxRuntime.jsx)(_navigationStyles.ItemIconUI, {
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.Icon, {
          icon: icon
        })
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_baseContent.default, {
        title: title,
        badge: badge
      }), navigateToMenu && /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.Icon, {
        icon: navigationIcon
      })]
    })
  });
}
var _default = exports.default = NavigationItem;
//# sourceMappingURL=index.js.map