---
import cx from 'classnames';

import { Img } from 'astro-imagetools/components';
import type { ImgConfigOptions } from 'astro-imagetools';

interface Props extends ImgConfigOptions {
	class?: string;
	noMargin?: boolean;
	src: string;
}

const { class: className, noMargin, src, ...props } = Astro.props;

const classes = cx('image-shadow mbe-10 mbs-0', { 'mbe-0': noMargin }, className);
const imageClasses =
	'rounded-1 border-1 block h-auto w-full border-solid border-black/[0.1] bg-black/[0.1] shadow shadow-black/10 dark:border-white/[0.1] dark:opacity-[0.87] dark:shadow-white/10';
---

<div class={classes}>
	{
		src.includes('.svg') ? (
			<img class={imageClasses} src={src} {...(props as any)} />
		) : (
			<Img class={imageClasses} src={src} {...props} />
		)
	}
</div>