ImgGallery

El componente ImgGallery es un componente que muestra galeria de imagenes.

Ejemplo

Importacion

Para importar el componente ImgGallery, se puede hacer desde fenextjs o fenextjs-component

import { ImgGallery, ImgGalleryProps } from "fenextjs/cjs/component/ImgGallery";

import { ImgGallery, ImgGalleryProps } from "fenextjs-component/cjs/ImgGallery";

Parametros

Parametro	Tipo	Requerido	Default	Descripcion
imgs	`ImgProps[]`	Sí		Lista de imágenes.
buttonShowMoreImg	`Omit<ButtonProps, "onClick">`	No		Propiedades del botón para mostrar más imágenes.
buttonHiddenMoreImg	`Omit<ButtonProps, "onClick">`	No		Propiedades del botón para ocultar más imágenes.
loader	`boolean`	No		Indica si la galería de imágenes está en estado de carga.
nLoader	`number`	No	5	Número de elementos cargadores.

Storybook

Para ver el storybook del componente lo puede hacer con este link (opens in a new tab)

Usos

Uso básico del componente ImgGallery

<ImgGallery
  imgs={[
    {
      name: "Img",
      src: "https://images3.alphacoders.com/273/27387.jpg",
    },
    {
      name: "Img",
      src: "https://images3.alphacoders.com/409/40949.jpg",
    },
    {
      name: "Img",
      src: "https://images4.alphacoders.com/585/58534.jpg",
    },
    {
      name: "Img",
      src: "https://images3.alphacoders.com/768/76885.jpg",
    },
    {
      name: "Img",
      src: "https://images4.alphacoders.com/672/67298.jpg",
    },
    {
      name: "Img",
      src: "https://images3.alphacoders.com/176/176767.jpg",
    },
    {
      name: "Img",
      src: "https://images.alphacoders.com/145/145923.jpg",
    },
  ]}
/>

Img Img Slider