@wordpress/edit-post/build-module/components/sidebar/template/index.js

Edit Post module for WordPress.

import { createElement } from "@wordpress/element";

/**
 * External dependencies
 */
import { partial, isEmpty, map } from 'lodash';
/**
 * WordPress dependencies
 */

import { __, sprintf } from '@wordpress/i18n';
import { PanelBody, SelectControl } from '@wordpress/components';
import { store as editorStore } from '@wordpress/editor';
import { useSelect, useDispatch } from '@wordpress/data';
import { store as coreStore } from '@wordpress/core-data';
/**
 * Internal dependencies
 */

import PostTemplateActions from './actions';
import { store as editPostStore } from '../../../store';
/**
 * Module Constants
 */

const PANEL_NAME = 'template';
export function TemplatePanel() {
  const {
    isEnabled,
    isOpened,
    selectedTemplate,
    availableTemplates,
    isViewable,
    template,
    supportsTemplateMode
  } = useSelect(select => {
    var _getPostType$viewable, _getPostType;

    const {
      isEditorPanelEnabled,
      isEditorPanelOpened,
      getEditedPostTemplate
    } = select(editPostStore);
    const {
      getEditedPostAttribute,
      getEditorSettings,
      getCurrentPostType
    } = select(editorStore);
    const {
      getPostType
    } = select(coreStore);

    const _isViewable = (_getPostType$viewable = (_getPostType = getPostType(getCurrentPostType())) === null || _getPostType === void 0 ? void 0 : _getPostType.viewable) !== null && _getPostType$viewable !== void 0 ? _getPostType$viewable : false;

    const _supportsTemplateMode = select(editorStore).getEditorSettings().supportsTemplateMode && _isViewable;

    return {
      isEnabled: isEditorPanelEnabled(PANEL_NAME),
      isOpened: isEditorPanelOpened(PANEL_NAME),
      selectedTemplate: getEditedPostAttribute('template'),
      availableTemplates: getEditorSettings().availableTemplates,
      template: _supportsTemplateMode && getEditedPostTemplate(),
      isViewable: _isViewable,
      supportsTemplateMode: _supportsTemplateMode
    };
  }, []);
  const {
    toggleEditorPanelOpened
  } = useDispatch(editPostStore);
  const {
    editPost
  } = useDispatch(editorStore);

  if (!isEnabled || !isViewable || isEmpty(availableTemplates) && !supportsTemplateMode) {
    return null;
  }

  const onTogglePanel = partial(toggleEditorPanelOpened, PANEL_NAME);

  let panelTitle = __('Template');

  if (!!template) {
    var _template$title$raw, _template$title;

    panelTitle = sprintf(
    /* translators: %s: template title */
    __('Template: %s'), (_template$title$raw = template === null || template === void 0 ? void 0 : (_template$title = template.title) === null || _template$title === void 0 ? void 0 : _template$title.raw) !== null && _template$title$raw !== void 0 ? _template$title$raw : template.slug);
  }

  return createElement(PanelBody, {
    title: panelTitle,
    opened: isOpened,
    onToggle: onTogglePanel
  }, createElement(SelectControl, {
    hideLabelFromVision: true,
    label: __('Template:'),
    value: selectedTemplate,
    onChange: templateSlug => {
      editPost({
        template: templateSlug || ''
      });
    },
    options: map(availableTemplates, (templateName, templateSlug) => ({
      value: templateSlug,
      label: templateName
    }))
  }), createElement(PostTemplateActions, null));
}
export default TemplatePanel;
//# sourceMappingURL=index.js.map