# `ShadcnUI.Components.Media.ImageGallery`
[🔗](https://github.com/pcharbon70/shadcn_ui/blob/main/lib/shadcn_ui/components/media/image_gallery.ex#L1)

A named responsive list of caller-owned image figures and complete destinations.

Require a unique `id`, exactly one `accessible_label`/`labelledby` and nonempty
`images`. Shared atom-keyed image records require stable key, src, explicit alt,
positive width/height; optional name, caption, href, srcset/sizes, loading,
decoding and full-size metadata are validated without fetching or processing.
Decorative images require empty alt, decorative: true and an independent name.
The ordinary link uses explicit href, else full.src, else the supplied src.

Columns are two/three/four (three default), density compact/comfortable, fit
cover/contain. Layout collapses to one column in narrow containers. Caption
slots are keyed, trusted noninteractive HEEx; a slot overrides its plain record
caption. Do not place controls, dialogs or unscoped IDs in caption content.
A caption slot receives `%{key: key, context: :thumbnail | :full}`; it is
rendered in both presentations, so keep it presentation-only and scope any IDs.

`lightbox` is `:dialog` (default) or `:none`. Each native Dialog has its own
thumbnail invoker, visible title and close control, with no current-image state.
`initial_focus` is `:auto`, `:content` or `:close`; dismissal is `:close_request`,
`:none` or `:any`. Declare `context: :dialog` when embedded in a modal: only
`lightbox: :none` is permitted there. The package cannot infer ancestor HEEx.
Enlarged images use full metadata when supplied, otherwise the same source;
they always use bounded contain sizing. Origin transitions are not shipped.

Native loading/decoding are hints, not deferred-fetch or privacy guarantees.
Applications own rights, CSP/origin policy, URL authorization, meaningful text,
dimensions, responsive candidates, destinations and replacement/restoration.
Image failures keep native alt, complete captions and ordinary links. No loader,
current-image state, uploads, transformation or runtime is provided.

# `image_gallery`

Renders validated responsive figures and separate complete image links.
## Attributes

* `id` (`:string`) (required)
* `accessible_label` (`:string`) - Defaults to `nil`.
* `labelledby` (`:string`) - Defaults to `nil`.
* `description` (`:string`) - Defaults to `nil`.
* `images` (`:list`) (required)
* `columns` (`:atom`) - Defaults to `:three`. Must be one of `:two`, `:three`, or `:four`.
* `density` (`:atom`) - Defaults to `:comfortable`. Must be one of `:compact`, or `:comfortable`.
* `fit` (`:atom`) - Defaults to `:cover`. Must be one of `:cover`, or `:contain`.
* `motion` (`:atom`) - Defaults to `:system`. Must be one of `:system`, or `:none`.
* `lightbox` (`:atom`) - Defaults to `:dialog`. Must be one of `:none`, or `:dialog`.
* `context` (`:atom`) - Defaults to `:root`. Must be one of `:root`, or `:dialog`.
* `initial_focus` (`:atom`) - Defaults to `:auto`. Must be one of `:auto`, `:content`, or `:close`.
* `dismissal` (`:atom`) - Defaults to `:close_request`. Must be one of `:none`, `:close_request`, or `:any`.
* `close_label` (`:string`) - Defaults to `"Close image"`.
* `class` (`:any`) - Defaults to `nil`.
* Global attributes are accepted.
## Slots

* `caption` - Accepts attributes:

  * `key` (`:string`) (required)

---

*Consult [api-reference.md](api-reference.md) for complete listing*