Dados & visualização
cosmemilton-ui/client

CmGallery

Use para galerias de imagens (ex.: fotos de vistoria): grade de miniaturas responsiva que abre um lightbox em tela cheia, com navegação por setas, Esc, miniaturas e legendas.

Import

tsx
import { CmGallery, CmLightbox, type CmGalleryItem } from "cosmemilton-ui/client";

Galeria com lightbox

Grade de miniaturas; clique abre o lightbox em tela cheia.

Lightbox standalone (controlado)

Abra o visualizador a partir de um botão, sem a grade.

API rápida

Props principais de cada peça exportada.

CmGallery

itemscolumnsratiogapradiusenableLightboxonItemClick

CmLightbox

itemsopenonCloseindex/onIndexChangeloopshowThumbnailsshowCounter

Notas

`CmGallery` embute o `CmLightbox`. Use o `CmLightbox` sozinho (controlado por `open`/`index`/`onClose`) para abrir a galeria a partir de outro gatilho.

`ratio` controla a proporção das miniaturas; o lightbox sempre mostra a imagem inteira (object-fit: contain). `CmGalleryItem`: { src, alt?, thumbnailSrc?, caption? }.