@wordpress/editor/build/components/post-format/index.js

Enhanced block editor for WordPress posts.

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.POST_FORMATS = void 0;
exports.default = PostFormat;
var _i18n = require("@wordpress/i18n");
var _components = require("@wordpress/components");
var _data = require("@wordpress/data");
var _compose = require("@wordpress/compose");
var _coreData = require("@wordpress/core-data");
var _check = _interopRequireDefault(require("./check"));
var _store = require("../../store");
var _jsxRuntime = require("react/jsx-runtime");
/**
 * WordPress dependencies
 */

/**
 * Internal dependencies
 */

// All WP post formats, sorted alphabetically by translated name.
const POST_FORMATS = exports.POST_FORMATS = [{
  id: 'aside',
  caption: (0, _i18n.__)('Aside')
}, {
  id: 'audio',
  caption: (0, _i18n.__)('Audio')
}, {
  id: 'chat',
  caption: (0, _i18n.__)('Chat')
}, {
  id: 'gallery',
  caption: (0, _i18n.__)('Gallery')
}, {
  id: 'image',
  caption: (0, _i18n.__)('Image')
}, {
  id: 'link',
  caption: (0, _i18n.__)('Link')
}, {
  id: 'quote',
  caption: (0, _i18n.__)('Quote')
}, {
  id: 'standard',
  caption: (0, _i18n.__)('Standard')
}, {
  id: 'status',
  caption: (0, _i18n.__)('Status')
}, {
  id: 'video',
  caption: (0, _i18n.__)('Video')
}].sort((a, b) => {
  const normalizedA = a.caption.toUpperCase();
  const normalizedB = b.caption.toUpperCase();
  if (normalizedA < normalizedB) {
    return -1;
  }
  if (normalizedA > normalizedB) {
    return 1;
  }
  return 0;
});

/**
 * `PostFormat` a component that allows changing the post format while also providing a suggestion for the current post.
 *
 * @example
 * ```jsx
 * <PostFormat />
 * ```
 *
 * @return {JSX.Element} The rendered PostFormat component.
 */
function PostFormat() {
  const instanceId = (0, _compose.useInstanceId)(PostFormat);
  const postFormatSelectorId = `post-format-selector-${instanceId}`;
  const {
    postFormat,
    suggestedFormat,
    supportedFormats
  } = (0, _data.useSelect)(select => {
    const {
      getEditedPostAttribute,
      getSuggestedPostFormat
    } = select(_store.store);
    const _postFormat = getEditedPostAttribute('format');
    const themeSupports = select(_coreData.store).getThemeSupports();
    return {
      postFormat: _postFormat !== null && _postFormat !== void 0 ? _postFormat : 'standard',
      suggestedFormat: getSuggestedPostFormat(),
      supportedFormats: themeSupports.formats
    };
  }, []);
  const formats = POST_FORMATS.filter(format => {
    // Ensure current format is always in the set.
    // The current format may not be a format supported by the theme.
    return supportedFormats?.includes(format.id) || postFormat === format.id;
  });
  const suggestion = formats.find(format => format.id === suggestedFormat);
  const {
    editPost
  } = (0, _data.useDispatch)(_store.store);
  const onUpdatePostFormat = format => editPost({
    format
  });
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_check.default, {
    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
      className: "editor-post-format",
      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_components.RadioControl, {
        className: "editor-post-format__options",
        label: (0, _i18n.__)('Post Format'),
        selected: postFormat,
        onChange: format => onUpdatePostFormat(format),
        id: postFormatSelectorId,
        options: formats.map(format => ({
          label: format.caption,
          value: format.id
        })),
        hideLabelFromVision: true
      }), suggestion && suggestion.id !== postFormat && /*#__PURE__*/(0, _jsxRuntime.jsx)("p", {
        className: "editor-post-format__suggestion",
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Button, {
          __next40pxDefaultSize: true,
          variant: "link",
          onClick: () => onUpdatePostFormat(suggestion.id),
          children: (0, _i18n.sprintf)( /* translators: %s: post format */
          (0, _i18n.__)('Apply suggested format: %s'), suggestion.caption)
        })
      })]
    })
  });
}
//# sourceMappingURL=index.js.map