@jalik/react-lightbox NPM

@jalik/react-lightbox

GitHub package.json version GitHub GitHub last commit npm

Quick start

This example allows to open any clicked images in LightBoxWrapper tags.

import { LightBoxProvider, LightBoxWrapper } from '@jalik/react-lightbox';

const images = [
  {alt: 'dogs', src: '/relative/images/dogs.jpg'},
  {alt: 'cats', src: 'http://localhost/images/cats.jpg'},
];

function App() {
  return (
    <LightBoxProvider
      duration={3000}
      loop
    >
      <div>
        <h1>Images</h1>
        <LightBoxWrapper items={images}>
          {images.map((image) => (
            <img src={image.src} alt={image.alt} />
          ))}
        </LightBoxWrapper>
      </div>
    </LightBoxProvider>
  );
}