"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = SidebarNavigationScreen;
var _clsx = _interopRequireDefault(require("clsx"));
var _components = require("@wordpress/components");
var _i18n = require("@wordpress/i18n");
var _icons = require("@wordpress/icons");
var _coreData = require("@wordpress/core-data");
var _data = require("@wordpress/data");
var _router = require("@wordpress/router");
var _element = require("@wordpress/element");
var _store = require("../../store");
var _lockUnlock = require("../../lock-unlock");
var _sidebarButton = _interopRequireDefault(require("../sidebar-button"));
var _isPreviewingTheme = require("../../utils/is-previewing-theme");
var _sidebar = require("../sidebar");
var _jsxRuntime = require("react/jsx-runtime");
/**
 * External dependencies
 */

/**
 * WordPress dependencies
 */

/**
 * Internal dependencies
 */

const {
  useHistory,
  useLocation
} = (0, _lockUnlock.unlock)(_router.privateApis);
function SidebarNavigationScreen({
  isRoot,
  title,
  actions,
  meta,
  content,
  footer,
  description,
  backPath: backPathProp
}) {
  const {
    dashboardLink,
    dashboardLinkText,
    previewingThemeName
  } = (0, _data.useSelect)(select => {
    const {
      getSettings
    } = (0, _lockUnlock.unlock)(select(_store.store));
    const currentlyPreviewingThemeId = (0, _isPreviewingTheme.currentlyPreviewingTheme)();
    return {
      dashboardLink: getSettings().__experimentalDashboardLink,
      dashboardLinkText: getSettings().__experimentalDashboardLinkText,
      // Do not call `getTheme` with null, it will cause a request to
      // the server.
      previewingThemeName: currentlyPreviewingThemeId ? select(_coreData.store).getTheme(currentlyPreviewingThemeId)?.name?.rendered : undefined
    };
  }, []);
  const location = useLocation();
  const history = useHistory();
  const {
    navigate
  } = (0, _element.useContext)(_sidebar.SidebarNavigationContext);
  const backPath = backPathProp !== null && backPathProp !== void 0 ? backPathProp : location.state?.backPath;
  const icon = (0, _i18n.isRTL)() ? _icons.chevronRight : _icons.chevronLeft;
  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_components.__experimentalVStack, {
      className: (0, _clsx.default)('edit-site-sidebar-navigation-screen__main', {
        'has-footer': !!footer
      }),
      spacing: 0,
      justify: "flex-start",
      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_components.__experimentalHStack, {
        spacing: 3,
        alignment: "flex-start",
        className: "edit-site-sidebar-navigation-screen__title-icon",
        children: [!isRoot && /*#__PURE__*/(0, _jsxRuntime.jsx)(_sidebarButton.default, {
          onClick: () => {
            history.navigate(backPath);
            navigate('back');
          },
          icon: icon,
          label: (0, _i18n.__)('Back'),
          showTooltip: false
        }), isRoot && /*#__PURE__*/(0, _jsxRuntime.jsx)(_sidebarButton.default, {
          icon: icon,
          label: dashboardLinkText || (0, _i18n.__)('Go to the Dashboard'),
          href: dashboardLink
        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.__experimentalHeading, {
          className: "edit-site-sidebar-navigation-screen__title",
          color: '#e0e0e0' /* $gray-200 */,
          level: 1,
          size: 20,
          children: !(0, _isPreviewingTheme.isPreviewingTheme)() ? title : (0, _i18n.sprintf)(/* translators: 1: theme name. 2: title */
          (0, _i18n.__)('Previewing %1$s: %2$s'), previewingThemeName, title)
        }), actions && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
          className: "edit-site-sidebar-navigation-screen__actions",
          children: actions
        })]
      }), meta && /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
          className: "edit-site-sidebar-navigation-screen__meta",
          children: meta
        })
      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
        className: "edit-site-sidebar-navigation-screen__content",
        children: [description && /*#__PURE__*/(0, _jsxRuntime.jsx)("p", {
          className: "edit-site-sidebar-navigation-screen__description",
          children: description
        }), content]
      })]
    }), footer && /*#__PURE__*/(0, _jsxRuntime.jsx)("footer", {
      className: "edit-site-sidebar-navigation-screen__footer",
      children: footer
    })]
  });
}
//# sourceMappingURL=index.js.map