@wordpress/components/build/navigation/back-button/index.js

UI components for WordPress.

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

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

var _element = require("@wordpress/element");

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

var _i18n = require("@wordpress/i18n");

var _icons = require("@wordpress/icons");

var _context = require("../context");

var _navigationStyles = require("../styles/navigation-styles");

/**
 * External dependencies
 */

/**
 * WordPress dependencies
 */

/**
 * Internal dependencies
 */
function NavigationBackButton({
  backButtonLabel,
  className,
  href,
  onClick,
  parentMenu
}, ref) {
  var _navigationTree$getMe;

  const {
    setActiveMenu,
    navigationTree
  } = (0, _context.useNavigationContext)();
  const classes = (0, _classnames.default)('components-navigation__back-button', className);
  const parentMenuTitle = (_navigationTree$getMe = navigationTree.getMenu(parentMenu)) === null || _navigationTree$getMe === void 0 ? void 0 : _navigationTree$getMe.title;

  const handleOnClick = event => {
    if (typeof onClick === 'function') {
      onClick(event);
    }

    const animationDirection = (0, _i18n.isRTL)() ? 'left' : 'right';

    if (parentMenu && !event.defaultPrevented) {
      setActiveMenu(parentMenu, animationDirection);
    }
  };

  const icon = (0, _i18n.isRTL)() ? _icons.chevronRight : _icons.chevronLeft;
  return (0, _element.createElement)(_navigationStyles.MenuBackButtonUI, {
    className: classes,
    href: href,
    isTertiary: true,
    ref: ref,
    onClick: handleOnClick
  }, (0, _element.createElement)(_icons.Icon, {
    icon: icon
  }), backButtonLabel || parentMenuTitle || (0, _i18n.__)('Back'));
}

var _default = (0, _element.forwardRef)(NavigationBackButton);

exports.default = _default;
//# sourceMappingURL=index.js.map