aboutsummaryrefslogtreecommitdiffstats
path: root/src/components/MDX/ResponsiveImage/ResponsiveImage.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'src/components/MDX/ResponsiveImage/ResponsiveImage.tsx')
-rw-r--r--src/components/MDX/ResponsiveImage/ResponsiveImage.tsx20
1 files changed, 12 insertions, 8 deletions
diff --git a/src/components/MDX/ResponsiveImage/ResponsiveImage.tsx b/src/components/MDX/ResponsiveImage/ResponsiveImage.tsx
index 062c04b..6c39e7f 100644
--- a/src/components/MDX/ResponsiveImage/ResponsiveImage.tsx
+++ b/src/components/MDX/ResponsiveImage/ResponsiveImage.tsx
@@ -1,12 +1,8 @@
-import Image, { ImageProps } from 'next/image';
+import { ResponsiveImageProps } from '@ts/types/app';
+import Image from 'next/image';
import Link from 'next/link';
import styles from './ResponsiveImage.module.scss';
-type ResponsiveImageProps = ImageProps & {
- caption?: string;
- linkTarget?: string;
-};
-
const ResponsiveImage = (props: ResponsiveImageProps) => {
const { caption, linkTarget, ...attributes } = props;
@@ -15,7 +11,11 @@ const ResponsiveImage = (props: ResponsiveImageProps) => {
{linkTarget ? (
<Link href={linkTarget}>
<a className={styles.link}>
- <Image alt={attributes.alt} layout="intrinsic" {...attributes} />
+ <Image
+ alt={attributes.alt}
+ layout={attributes.layout || 'intrinsic'}
+ {...attributes}
+ />
{caption && (
<figcaption className={styles.caption}>{caption}</figcaption>
)}
@@ -23,7 +23,11 @@ const ResponsiveImage = (props: ResponsiveImageProps) => {
</Link>
) : (
<>
- <Image alt={attributes.alt} layout="intrinsic" {...attributes} />
+ <Image
+ alt={attributes.alt}
+ layout={attributes.layout || 'intrinsic'}
+ {...attributes}
+ />
{caption && (
<figcaption className={styles.caption}>{caption}</figcaption>
)}