@spoolcms/nextjs
Version:
The beautiful headless CMS for Next.js developers
32 lines (31 loc) • 1.03 kB
TypeScript
/**
* Image utility functions for Spool CMS
*/
export type ImageSize = 'thumb' | 'small' | 'original';
export interface ImageSizes {
original: string;
thumb: string;
small: string;
}
/**
* Helper function to get the appropriate image URL from Spool image field
*
* @param imageValue - The image field value (can be a string URL or an object with sizes)
* @param size - The desired image size ('thumb' | 'small' | 'original')
* @returns The appropriate image URL
*
* @example
* ```tsx
* import { img } from '@spoolcms/nextjs';
*
* // Use thumbnail for fast loading in lists
* <Image src={img(item.headerImage, 'thumb')} width={160} height={90} />
*
* // Use small for medium-sized displays
* <Image src={img(item.headerImage, 'small')} width={480} height={270} />
*
* // Use original for full-size displays
* <Image src={img(item.headerImage, 'original')} width={1200} height={675} />
* ```
*/
export declare function img(imageValue: string | ImageSizes | null | undefined, size?: ImageSize): string;