Stays Gallery

Gallery

Swipe through a place — pictures in one shape, arrows and arrow keys.

Preview

Usage

tsx

import { Gallery } from "zostel-ui";

<Gallery
  images={[
    { src: "/brand/scenes/valleys.svg", alt: "Valleys" },
    { src: "/brand/scenes/waters.svg", alt: "Waters" },
  ]}
  aspectRatio={16 / 9}
/>

Props

Prop	Type	Default	Description
`images`	`{ src: string; alt: string }[]`	—	The pictures; say what each shows in alt.
`aspectRatio`	`number`	`16 / 9`	Width ÷ height, for all of them.
`className`	`string`	—	More classes, merged with the component’s own (tailwind-merge).

images

Type: { src: string; alt: string }[]

Default: —

The pictures; say what each shows in alt.

aspectRatio

Type: number

Default: 16 / 9

Width ÷ height, for all of them.

className

Type: string

Default: —

More classes, merged with the component’s own (tailwind-merge).