@prismicio/react/dist/PrismicImage.js

React components and hooks to fetch and present Prismic content

import { devMsg } from "./lib/devMsg.js";
import { asImagePixelDensitySrcSet, asImageWidthSrcSet, isFilled } from "@prismicio/client";
import { DEV } from "esm-env";
import { forwardRef } from "react";
import { Fragment as Fragment$1, jsx } from "react/jsx-runtime";
//#region src/PrismicImage.tsx
/**
* Renders an optimized image from a Prismic image field.
*
* @example
* 	```tsx
* 	<PrismicImage field={slice.primary.photo} />;
* 	```
*
* @see Learn how to optimize images with imgix, use responsive images, and use framework-specific image components: {@link https://prismic.io/docs/fields/image}
*/
const PrismicImage = forwardRef(function PrismicImage(props, ref) {
	const { field, alt, fallbackAlt, imgixParams = {}, widths, pixelDensities, fallback, ...restProps } = props;
	if (DEV) {
		if (typeof alt === "string" && alt !== "") console.warn(`[PrismicImage] The "alt" prop can only be used to declare an image as decorative by passing an empty string (alt="") but was provided a non-empty string. You can resolve this warning by removing the "alt" prop or changing it to alt="". For more details, see ${devMsg("alt-must-be-an-empty-string")}`);
		if (typeof fallbackAlt === "string" && fallbackAlt !== "") console.warn(`[PrismicImage] The "fallbackAlt" prop can only be used to declare an image as decorative by passing an empty string (fallbackAlt="") but was provided a non-empty string. You can resolve this warning by removing the "fallbackAlt" prop or changing it to fallbackAlt="". For more details, see ${devMsg("alt-must-be-an-empty-string")}`);
		if (widths && pixelDensities) console.warn(`[PrismicImage] Only one of "widths" or "pixelDensities" props can be provided. You can resolve this warning by removing either the "widths" or "pixelDensities" prop. "widths" will be used in this case.`);
	}
	if (!isFilled.imageThumbnail(field)) return /* @__PURE__ */ jsx(Fragment$1, { children: fallback });
	const resolvedImgixParams = imgixParams;
	for (const x in imgixParams) if (resolvedImgixParams[x] === null) resolvedImgixParams[x] = void 0;
	let src;
	let srcSet;
	if (widths || !pixelDensities) {
		const res = asImageWidthSrcSet(field, {
			...resolvedImgixParams,
			widths: widths === "defaults" ? void 0 : widths
		});
		src = res.src;
		srcSet = res.srcset;
	} else if (pixelDensities) {
		const res = asImagePixelDensitySrcSet(field, {
			...resolvedImgixParams,
			pixelDensities: pixelDensities === "defaults" ? void 0 : pixelDensities
		});
		src = res.src;
		srcSet = res.srcset;
	}
	return /* @__PURE__ */ jsx("img", {
		ref,
		src,
		srcSet,
		alt: alt ?? (field.alt || fallbackAlt),
		...restProps
	});
});
//#endregion
export { PrismicImage };

//# sourceMappingURL=PrismicImage.js.map