@wordpress/block-library/build/image/save.js

Block library for the WordPress editor.

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = save;
var _clsx = _interopRequireDefault(require("clsx"));
var _blockEditor = require("@wordpress/block-editor");
var _jsxRuntime = require("react/jsx-runtime");
/**
 * External dependencies
 */

/**
 * WordPress dependencies
 */

function save({
  attributes
}) {
  const {
    url,
    alt,
    caption,
    align,
    href,
    rel,
    linkClass,
    width,
    height,
    aspectRatio,
    scale,
    id,
    linkTarget,
    sizeSlug,
    title
  } = attributes;
  const newRel = !rel ? undefined : rel;
  const borderProps = (0, _blockEditor.__experimentalGetBorderClassesAndStyles)(attributes);
  const shadowProps = (0, _blockEditor.__experimentalGetShadowClassesAndStyles)(attributes);
  const classes = (0, _clsx.default)({
    // All other align classes are handled by block supports.
    // `{ align: 'none' }` is unique to transforms for the image block.
    alignnone: 'none' === align,
    [`size-${sizeSlug}`]: sizeSlug,
    'is-resized': width || height,
    'has-custom-border': !!borderProps.className || borderProps.style && Object.keys(borderProps.style).length > 0
  });
  const imageClasses = (0, _clsx.default)(borderProps.className, {
    [`wp-image-${id}`]: !!id
  });
  const image = /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
    src: url,
    alt: alt,
    className: imageClasses || undefined,
    style: {
      ...borderProps.style,
      ...shadowProps.style,
      aspectRatio,
      objectFit: scale,
      width,
      height
    },
    title: title
  });
  const figure = /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
    children: [href ? /*#__PURE__*/(0, _jsxRuntime.jsx)("a", {
      className: linkClass,
      href: href,
      target: linkTarget,
      rel: newRel,
      children: image
    }) : image, !_blockEditor.RichText.isEmpty(caption) && /*#__PURE__*/(0, _jsxRuntime.jsx)(_blockEditor.RichText.Content, {
      className: (0, _blockEditor.__experimentalGetElementClassName)('caption'),
      tagName: "figcaption",
      value: caption
    })]
  });
  return /*#__PURE__*/(0, _jsxRuntime.jsx)("figure", {
    ..._blockEditor.useBlockProps.save({
      className: classes
    }),
    children: figure
  });
}
//# sourceMappingURL=save.js.map