45 lines
1.0 KiB
TypeScript
45 lines
1.0 KiB
TypeScript
import Image from "next/image";
|
|
import { ImgHTMLAttributes } from "react";
|
|
|
|
interface CustomImageProps extends Omit<ImgHTMLAttributes<HTMLImageElement>, 'src' | 'alt'> {
|
|
src: string;
|
|
alt: string;
|
|
fill?: boolean;
|
|
sizes?: string;
|
|
priority?: boolean;
|
|
}
|
|
|
|
export const CustomImage = ({ src, alt, fill, sizes, priority, className, style, ...props }: CustomImageProps) => {
|
|
// Check if src is a data URL (base64)
|
|
const isDataUrl = src.startsWith('data:');
|
|
|
|
if (isDataUrl) {
|
|
// For data URLs, use regular img tag
|
|
return (
|
|
<img
|
|
src={src}
|
|
alt={alt}
|
|
className={className}
|
|
style={{
|
|
objectFit: 'cover',
|
|
width: fill ? '100%' : undefined,
|
|
height: fill ? '100%' : undefined,
|
|
...style
|
|
}}
|
|
{...props}
|
|
/>
|
|
);
|
|
}
|
|
|
|
// For regular URLs, use Next.js Image component
|
|
return (
|
|
<Image
|
|
src={src}
|
|
alt={alt}
|
|
fill={fill}
|
|
sizes={sizes}
|
|
priority={priority}
|
|
className={className}
|
|
/>
|
|
);
|
|
};
|