@wordpress/components
Version:
UI components for WordPress.
68 lines (63 loc) • 2.06 kB
JavaScript
;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = exports.NavigationBackButton = void 0;
var _clsx = _interopRequireDefault(require("clsx"));
var _element = require("@wordpress/element");
var _i18n = require("@wordpress/i18n");
var _icons = require("@wordpress/icons");
var _context = require("../context");
var _navigationStyles = require("../styles/navigation-styles");
var _jsxRuntime = require("react/jsx-runtime");
/**
* External dependencies
*/
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
function UnforwardedNavigationBackButton({
backButtonLabel,
className,
href,
onClick,
parentMenu
}, ref) {
const {
setActiveMenu,
navigationTree
} = (0, _context.useNavigationContext)();
const classes = (0, _clsx.default)('components-navigation__back-button', className);
const parentMenuTitle = parentMenu !== undefined ? navigationTree.getMenu(parentMenu)?.title : undefined;
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 /*#__PURE__*/(0, _jsxRuntime.jsxs)(_navigationStyles.MenuBackButtonUI, {
__next40pxDefaultSize: true,
className: classes,
href: href,
variant: "tertiary",
ref: ref,
onClick: handleOnClick,
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.Icon, {
icon: icon
}), backButtonLabel || parentMenuTitle || (0, _i18n.__)('Back')]
});
}
/**
* @deprecated Use `Navigator` instead.
*/
const NavigationBackButton = exports.NavigationBackButton = (0, _element.forwardRef)(UnforwardedNavigationBackButton);
var _default = exports.default = NavigationBackButton;
//# sourceMappingURL=index.js.map