@wordpress/editor/build/components/post-template/block-theme.js

Enhanced block editor for WordPress posts.

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = BlockThemeControl;
var _data = require("@wordpress/data");
var _htmlEntities = require("@wordpress/html-entities");
var _components = require("@wordpress/components");
var _element = require("@wordpress/element");
var _i18n = require("@wordpress/i18n");
var _coreData = require("@wordpress/core-data");
var _icons = require("@wordpress/icons");
var _notices = require("@wordpress/notices");
var _preferences = require("@wordpress/preferences");
var _postPanelRow = _interopRequireDefault(require("../post-panel-row"));
var _store = require("../../store");
var _swapTemplateButton = _interopRequireDefault(require("./swap-template-button"));
var _resetDefaultTemplate = _interopRequireDefault(require("./reset-default-template"));
var _lockUnlock = require("../../lock-unlock");
var _createNewTemplate = _interopRequireDefault(require("./create-new-template"));
var _jsxRuntime = require("react/jsx-runtime");
/**
 * WordPress dependencies
 */

/**
 * Internal dependencies
 */

/**
 * Internal dependencies
 */

function BlockThemeControl({
  id
}) {
  const {
    isTemplateHidden,
    onNavigateToEntityRecord,
    getEditorSettings,
    hasGoBack
  } = (0, _data.useSelect)(select => {
    const {
      getRenderingMode,
      getEditorSettings: _getEditorSettings
    } = (0, _lockUnlock.unlock)(select(_store.store));
    const editorSettings = _getEditorSettings();
    return {
      isTemplateHidden: getRenderingMode() === 'post-only',
      onNavigateToEntityRecord: editorSettings.onNavigateToEntityRecord,
      getEditorSettings: _getEditorSettings,
      hasGoBack: editorSettings.hasOwnProperty('onNavigateToPreviousEntityRecord')
    };
  }, []);
  const {
    get: getPreference
  } = (0, _data.useSelect)(_preferences.store);
  const {
    editedRecord: template,
    hasResolved
  } = (0, _coreData.useEntityRecord)('postType', 'wp_template', id);
  const {
    createSuccessNotice
  } = (0, _data.useDispatch)(_notices.store);
  const {
    setRenderingMode,
    setDefaultRenderingMode
  } = (0, _lockUnlock.unlock)((0, _data.useDispatch)(_store.store));
  const canCreateTemplate = (0, _data.useSelect)(select => !!select(_coreData.store).canUser('create', {
    kind: 'postType',
    name: 'wp_template'
  }), []);
  const [popoverAnchor, setPopoverAnchor] = (0, _element.useState)(null);
  // Memoize popoverProps to avoid returning a new object every time.
  const popoverProps = (0, _element.useMemo)(() => ({
    // Anchor the popover to the middle of the entire row so that it doesn't
    // move around when the label changes.
    anchor: popoverAnchor,
    className: 'editor-post-template__dropdown',
    placement: 'left-start',
    offset: 36,
    shift: true
  }), [popoverAnchor]);
  if (!hasResolved) {
    return null;
  }

  // The site editor does not have a `onNavigateToPreviousEntityRecord` setting as it uses its own routing
  // and assigns its own backlink to focusMode pages.
  const notificationAction = hasGoBack ? [{
    label: (0, _i18n.__)('Go back'),
    onClick: () => getEditorSettings().onNavigateToPreviousEntityRecord()
  }] : undefined;
  const mayShowTemplateEditNotice = () => {
    if (!getPreference('core/edit-site', 'welcomeGuideTemplate')) {
      createSuccessNotice((0, _i18n.__)('Editing template. Changes made here affect all posts and pages that use the template.'), {
        type: 'snackbar',
        actions: notificationAction
      });
    }
  };
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_postPanelRow.default, {
    label: (0, _i18n.__)('Template'),
    ref: setPopoverAnchor,
    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.DropdownMenu, {
      popoverProps: popoverProps,
      focusOnMount: true,
      toggleProps: {
        size: 'compact',
        variant: 'tertiary',
        tooltipPosition: 'middle left'
      },
      label: (0, _i18n.__)('Template options'),
      text: (0, _htmlEntities.decodeEntities)(template.title),
      icon: null,
      children: ({
        onClose
      }) => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
        children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_components.MenuGroup, {
          children: [canCreateTemplate && /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.MenuItem, {
            onClick: () => {
              onNavigateToEntityRecord({
                postId: template.id,
                postType: 'wp_template'
              });
              onClose();
              mayShowTemplateEditNotice();
            },
            children: (0, _i18n.__)('Edit template')
          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_swapTemplateButton.default, {
            onClick: onClose
          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_resetDefaultTemplate.default, {
            onClick: onClose
          }), canCreateTemplate && /*#__PURE__*/(0, _jsxRuntime.jsx)(_createNewTemplate.default, {})]
        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.MenuGroup, {
          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.MenuItem, {
            icon: !isTemplateHidden ? _icons.check : undefined,
            isSelected: !isTemplateHidden,
            role: "menuitemcheckbox",
            onClick: () => {
              const newRenderingMode = isTemplateHidden ? 'template-locked' : 'post-only';
              setRenderingMode(newRenderingMode);
              setDefaultRenderingMode(newRenderingMode);
            },
            children: (0, _i18n.__)('Show template')
          })
        })]
      })
    })
  });
}
//# sourceMappingURL=block-theme.js.map