@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.default = PostFormat;
exports.POST_FORMATS = void 0;

var _element = require("@wordpress/element");

var _lodash = require("lodash");

var _i18n = require("@wordpress/i18n");

var _components = require("@wordpress/components");

var _data = require("@wordpress/data");

var _compose = require("@wordpress/compose");

var _check = _interopRequireDefault(require("./check"));

/**
 * External dependencies
 */

/**
 * WordPress dependencies
 */

/**
 * Internal dependencies
 */
// All WP post formats, sorted alphabetically by translated name.
const 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;
});
exports.POST_FORMATS = POST_FORMATS;

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('core/editor');

    const _postFormat = getEditedPostAttribute('format');

    const themeSupports = select('core').getThemeSupports();
    return {
      postFormat: _postFormat !== null && _postFormat !== void 0 ? _postFormat : 'standard',
      suggestedFormat: getSuggestedPostFormat(),
      // Ensure current format is always in the set.
      // The current format may not be a format supported by the theme.
      supportedFormats: (0, _lodash.union)([_postFormat], (0, _lodash.get)(themeSupports, ['formats'], []))
    };
  }, []);
  const formats = POST_FORMATS.filter(format => (0, _lodash.includes)(supportedFormats, format.id));
  const suggestion = (0, _lodash.find)(formats, format => format.id === suggestedFormat);
  const {
    editPost
  } = (0, _data.useDispatch)('core/editor');

  const onUpdatePostFormat = format => editPost({
    format
  });

  return (0, _element.createElement)(_check.default, null, (0, _element.createElement)("div", {
    className: "editor-post-format"
  }, (0, _element.createElement)("div", {
    className: "editor-post-format__content"
  }, (0, _element.createElement)("label", {
    htmlFor: postFormatSelectorId
  }, (0, _i18n.__)('Post Format')), (0, _element.createElement)(_components.SelectControl, {
    value: postFormat,
    onChange: format => onUpdatePostFormat(format),
    id: postFormatSelectorId,
    options: formats.map(format => ({
      label: format.caption,
      value: format.id
    }))
  })), suggestion && suggestion.id !== postFormat && (0, _element.createElement)("div", {
    className: "editor-post-format__suggestion"
  }, (0, _i18n.__)('Suggestion:'), ' ', (0, _element.createElement)(_components.Button, {
    isLink: true,
    onClick: () => onUpdatePostFormat(suggestion.id)
  }, suggestion.caption))));
}
//# sourceMappingURL=index.js.map