react-pictures-viewer

React Pictures Viewer

A simple react.js library for viewing pictures ⚡️

Installation

Install with npm

  npm install react-pictures-viewer

Install with yarn

  yarn add react-pictures-viewer

Usage/Examples

import PicturesViewer from "react-pictures-viewer";

const data = [
  {
    src: "./large-image.png",
    smallSrc:
      "small-image-png",
  },
]

 <PicturesViewer
    initialImageIndex={0}
    isZoomOnMouseMoveEnabled={false}
    data={data}
/>

Passing a children prop:

<PicturesViewer
    initialImageIndex={0}
    data={data}
>
<div style={{
    position: "absolute",
    top: 10,
    left: 10
}}>Child</div>
</PicturesViewer>

Run with vite.js

  git clone https://github.com/aldovandus/react-pictures-viewer
  cd react-pictures-viewer
  yarn install
  yarn dev