components ImageGallery.tsx

100% Statements 2/2

100% Branches 0/0

100% Functions 2/2

100% Lines 2/2

Press n or j to go to the next uncovered block, b, p or k for the previous block.


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31  
 
 
 
 
 
 
 
 
 
 
59x
 
 
 
 
 
 
 
 
 
688x
 
 
 
 
 
 
 
 
  import type { GalleryImage } from "../data";
 
interface ImageGalleryProps {
  images: readonly GalleryImage[];
  titleId: string;
  eyebrow: string;
  loading: "eager" | "lazy";
  decoding: "sync" | "async";
}
 
export function ImageGallery({ images, titleId, eyebrow, loading, decoding }: ImageGalleryProps) {
  return (
    <section className="panel gallery-panel" aria-labelledby={titleId}>
      <div className="panel-header">
        <div>
          <p className="eyebrow">{eyebrow}</p>
          <h2 id={titleId}>Scenario captures</h2>
        </div>
      </div>
      <div className="gallery-grid">
        {images.map((image) => (
          <figure key={image.id}>
            <img src={image.src} alt={image.alt} loading={loading} decoding={decoding} />
            <figcaption>{image.title}</figcaption>
          </figure>
        ))}
      </div>
    </section>
  );
}