React Fullscreen Image Viewer

A React component for viewing images in fullscreen with zoom and navigation capabilities.

Installation

npm install react-fullscreen-image-viewer

Usage

import React, { useState } from 'react';
import ImageViewer from 'react-fullscreen-image-viewer';

const MyComponent = () => {
  const images = [
    'https://example.com/image1.jpg',
    'https://example.com/image2.jpg',
    'https://example.com/image3.jpg',
  ];

  return (
    <div>
        <ImageViewer images={images} />
    </div>
  );
};

Props

| Prop | Type | Default | Description | |------|------|---------|-------------| | images | string[] | Required | An array of image URLs to be displayed in the viewer | | initialIndex | number | 0 | The index of the image to display first | | allowDownload | boolean | false | Whether to allow image downloads | | thumbnailWidth | number | 100 | Width of thumbnail images in pixels | | thumbnailHeight | number | 100 | Height of thumbnail images in pixels |