/ docs / src / components / ImageBox / index.tsx
index.tsx
 1  import React from 'react';
 2  import styles from './ImageBox.module.css';
 3  import useBaseUrl from '@docusaurus/useBaseUrl';
 4  
 5  interface ImageBoxProps {
 6    src: string;
 7    alt: string;
 8    width?: string;
 9    caption?: string;
10    className?: string;
11  }
12  
13  export default function ImageBox({ src, alt, width, caption, className }: ImageBoxProps) {
14    return (
15      <div className={`${styles.container} ${className || ''}`}>
16        <div className={styles.imageWrapper} style={width ? { width } : {}}>
17          <img src={useBaseUrl(src)} alt={alt} className={styles.image} />
18        </div>
19        {caption && <p className={styles.caption}>{caption}</p>}
20      </div>
21    );
22  }