"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = SidebarNavigationItem;
var _clsx = _interopRequireDefault(require("clsx"));
var _components = require("@wordpress/components");
var _i18n = require("@wordpress/i18n");
var _icons = require("@wordpress/icons");
var _router = require("@wordpress/router");
var _element = require("@wordpress/element");
var _lockUnlock = require("../../lock-unlock");
var _sidebar = require("../sidebar");
var _jsxRuntime = require("react/jsx-runtime");
/**
 * External dependencies
 */

/**
 * WordPress dependencies
 */

/**
 * Internal dependencies
 */

const {
  useHistory,
  useLink
} = (0, _lockUnlock.unlock)(_router.privateApis);
function SidebarNavigationItem({
  className,
  icon,
  withChevron = false,
  suffix,
  uid,
  to,
  onClick,
  children,
  ...props
}) {
  const history = useHistory();
  const {
    navigate
  } = (0, _element.useContext)(_sidebar.SidebarNavigationContext);
  // If there is no custom click handler, create one that navigates to `params`.
  function handleClick(e) {
    if (onClick) {
      onClick(e);
      navigate('forward');
    } else if (to) {
      e.preventDefault();
      history.navigate(to);
      navigate('forward', `[id="${uid}"]`);
    }
  }
  const linkProps = useLink(to);
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.__experimentalItem, {
    className: (0, _clsx.default)('edit-site-sidebar-navigation-item', {
      'with-suffix': !withChevron && suffix
    }, className),
    id: uid,
    onClick: handleClick,
    href: to ? linkProps.href : undefined,
    ...props,
    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_components.__experimentalHStack, {
      justify: "flex-start",
      children: [icon && /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.Icon, {
        style: {
          fill: 'currentcolor'
        },
        icon: icon,
        size: 24
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.FlexBlock, {
        children: children
      }), withChevron && /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.Icon, {
        icon: (0, _i18n.isRTL)() ? _icons.chevronLeftSmall : _icons.chevronRightSmall,
        className: "edit-site-sidebar-navigation-item__drilldown-indicator",
        size: 24
      }), !withChevron && suffix]
    })
  });
}
//# sourceMappingURL=index.js.map