Image Gallery
The <pines-image-gallery> component renders a responsive grid of images with a lightbox viewer for full-size display. Use it to present photo collections, portfolios, product image sets, or any content where users benefit from browsing a set of images and expanding individual photos for closer inspection.
Properties
| Attribute | Type | Default | Description |
image-list
|
List<GalleryItem>
|
new List<>()
|
The collection of images to display in the gallery. Populate this from your page model using a list of GalleryItem objects, each describing one image and its accessible label. |
GalleryItem Properties
| Property | Type | Description |
ImageUrl
|
string
|
URL of the image to display. Serialized as "photo" in JSON. Use an absolute or root-relative URL pointing to the image resource — both hosted CDN URLs and local paths under wwwroot are valid. |
ImageAlt
|
string
|
Accessible alt text for the image. Serialized as "alt" in JSON. Provide a meaningful description of the image content for screen readers and as a fallback when the image fails to load. |