UNPKG

@agility/nextjs

Version:

Agility CMS support for NextJS 16 and Next Image

45 lines (44 loc) 1.72 kB
import React, { FC } from "react"; import { ImageField } from "./types"; interface AgilityImageSourceProps extends Omit<React.DetailedHTMLProps<React.SourceHTMLAttributes<HTMLSourceElement>, HTMLSourceElement>, "srcSet"> { } /** * The AgilityPic component allows you to specify different image sizes for different css media selectors. * @exports * @interface AgilityImageProps */ export interface AgilityPicProps { /** * An image from Agility. */ image: ImageField; /** * optional: the fallback width of the image to output in the <img> tag after the sources. * This will render if no sources are selected, or if the browser does not support the <picture> tag. */ fallbackWidth?: number; /** * optional: the alt text for the image if you don't want to use the one defined on the image from Agility. */ alt?: string; /** * optional: the sources for the image. This allows you to specify different image sizes for different css media selectors. */ sources?: AgilityImageSourceProps[]; /** * optional: if true, the fallback <img> as eager instead of lazy. */ priority?: boolean; /** * The class name to apply to the <img>. You do NOT have to apply classNames to the source tags, as they inherit the class from the img. */ className?: string; } /** * This will output a picture tag with the image and sources provided, using the Agility Image API. * The sources property allows you to specify different image sizes for different css media selectors. * * @param {AgilityPicProps} props */ export declare const AgilityPic: FC<AgilityPicProps>; export {};