import { last } from '../../../helper/last'; import { html } from '../../../types/html'; import { ResponsiveImage } from '../../../types/responsive-image'; import './image.scss'; export const Image = ({ image, alt, container = false, isIgnoredByImageViewer = false, imageScreenRatio = 0.8, }: { image: ResponsiveImage; alt: string; container?: boolean; isIgnoredByImageViewer?: boolean; imageScreenRatio?: number; }): html => ` ${ container ? `
` : '' }
${alt}
${container ? '
' : ''} `; const getSizes = (image: ResponsiveImage, imageScreenRatio: number): string => image.images .slice(0, -1) .map((d) => `(max-width: ${d.width / imageScreenRatio}px) ${d.width}px,`) .join('\n') + `\n${last(image.images)!.width}px`;