@wordpress/block-library/build/gallery/use-image-sizes.js

Block library for the WordPress editor.

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = useImageSizes;

var _lodash = require("lodash");

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

/**
 * External dependencies
 */

/**
 * WordPress dependencies
 */

/**
 * Calculates the image sizes that are avaible for the current gallery images in order to
 * populate the 'Image size' selector.
 *
 * @param {Array}    images      Basic image block data taken from current gallery innerBlock
 * @param {boolean}  isSelected  Is the block currently selected in the editor.
 * @param {Function} getSettings Block editor store selector.
 *
 * @return {Array} An array of image size options.
 */
function useImageSizes(images, isSelected, getSettings) {
  return (0, _element.useMemo)(() => getImageSizing(), [images, isSelected]);

  function getImageSizing() {
    if (!images || images.length === 0) {
      return;
    }

    const {
      imageSizes
    } = getSettings();
    let resizedImages = {};

    if (isSelected) {
      resizedImages = images.reduce((currentResizedImages, img) => {
        if (!img.id) {
          return currentResizedImages;
        }

        const sizes = imageSizes.reduce((currentSizes, size) => {
          const defaultUrl = (0, _lodash.get)(img, ['sizes', size.slug, 'url']);
          const mediaDetailsUrl = (0, _lodash.get)(img, ['media_details', 'sizes', size.slug, 'source_url']);
          return { ...currentSizes,
            [size.slug]: defaultUrl || mediaDetailsUrl
          };
        }, {});
        return { ...currentResizedImages,
          [parseInt(img.id, 10)]: sizes
        };
      }, {});
    }

    return imageSizes.filter(_ref => {
      let {
        slug
      } = _ref;
      return (0, _lodash.some)(resizedImages, sizes => sizes[slug]);
    }).map(_ref2 => {
      let {
        name,
        slug
      } = _ref2;
      return {
        value: slug,
        label: name
      };
    });
  }
}
//# sourceMappingURL=use-image-sizes.js.map