Reference to imageStyle property in <img> tag not prefixed correctly.

.gitignore

@@ -1,2 +1,3 @@
 /node_modules
 /dist
+.vs

.npmignore

@@ -1 +1,2 @@
 /src
+/.vs

LICENSE.md

@@ -1,5 +1,6 @@
 MIT License
 
+Copyright (c) 2025 Edward Niewold
 Copyright (c) 2019 Alexander Tarasov
 
 Permission is hereby granted, free of charge, to any person obtaining a copy

README.md

@@ -1,36 +1,48 @@
-# React Simple Image Viewer
+# Simple Image Viewer
 
-[![npm version](https://badge.fury.io/js/react-simple-image-viewer.svg)](https://badge.fury.io/js/react-simple-image-viewer)
-[![Build Status](https://travis-ci.org/specter256/react-simple-image-viewer.svg?branch=master)](https://travis-ci.org/specter256/react-simple-image-viewer)
+Simple image viewer component for React v19+
 
-Simple image viewer component for React.
+This is an in-place replacement fork of the original repository [react-simple-image-viewer](https://github.com/specter256/react-simple-image-viewer).
+Apart from support for React version 19, some additional fixed and features have been added.
+
+# Change Log
+
+- v1.3.2 - Initial release with support for React 19, added closeOnClickInside property
+- v1.3.3 - Added alts property to provide alt text for images
+- v1.4.0 - Viewer shows captions under images based on alts string array (also added related disableCaption and captionStyle properties)
 
 # Installation
 
 ```shell
-$ npm install react-simple-image-viewer
+$ npm install simple-image-viewer-react19
 ```
 or
 ```shell
-$ yarn add react-simple-image-viewer
+$ yarn add simple-image-viewer-react19
 ```
 
 # Example
 
 ```jsx
 import React, { useState, useCallback } from 'react';
 import { render } from 'react-dom';
-import ImageViewer from 'react-simple-image-viewer';
+import ImageViewer from 'simple-image-viewer-react19';
 
 function App() {
   const [currentImage, setCurrentImage] = useState(0);
   const [isViewerOpen, setIsViewerOpen] = useState(false);
   const images = [
-    'http://placeimg.com/1200/800/nature',
-    'http://placeimg.com/800/1200/nature',
-    'http://placeimg.com/1920/1080/nature',
-    'http://placeimg.com/1500/500/nature',
+    'https://picsum.photos/1200/800',
+    'https://picsum.photos/800/1200',
+    'https://picsum.photos/1920/1080',
+    'https://picsum.photos/1500/500',
   ];
+  const alts = [
+    'Random image 1200 by 800',
+    'Random image 800 by 1200',
+    'Random image 1920 by 1080',
+    'Random image 1500 by 500',
+  ]
 
   const openImageViewer = useCallback((index) => {
     setCurrentImage(index);
@@ -51,16 +63,18 @@ function App() {
           width="300"
           key={ index }
           style={{ margin: '2px' }}
-          alt=""
+          alt={ alts[index] }
         />
       ))}
 
       {isViewerOpen && (
         <ImageViewer
           src={ images }
+          alt={ alts }
           currentIndex={ currentImage }
           disableScroll={ false }
           closeOnClickOutside={ true }
+          closeOnClickInside={ true }
           onClose={ closeImageViewer }
         />
       )}
@@ -71,23 +85,24 @@ function App() {
 render(<App />, document.getElementById('app'));
 ```
 
-# Demo
-
-[Try out demo on CodeSandbox](https://codesandbox.io/s/react-simple-image-viewer-demo-4itlr)
-
 # API
 
-| Property        |  Type     | Description                                                                       |
-| :-------------- | :-------- | :-------------------------------------------------------------------------------- |
-| src             | string[]  | Array of image URLs                                                               |
-| currentIndex    | number    | Index of image in `src` property which will be shown first when viewer is opened  |
-| onClose         | function  | Callback which will be called when viewer will closed                             |
-| backgroundStyle | object    | Custom styles for background of modal window                                      |
-| disableScroll   | boolean   | Disable scrolling images by mouse wheel                                           |
-| closeOnClickOutside   | boolean   | Whether viewer should be closed when clicking outside of image              |
-| closeComponent | JSX.Element | Custom component for the close button |
-| leftArrowComponent | JSX.Element | Custom component for the left arrow |
-| rightArrowComponent | JSX.Element | Custom component for the right arrow |
+| Property              |  Type         | Description                                                                       |
+| :--------------       | :--------     | :-------------------------------------------------------------------------------- |
+| src                   | string[]      | Array of image URLs                                                               |
+| alt                   | string[]      | Array of alt texts, used in image and show as caption under image                 |
+| currentIndex          | number        | Index of image in `src` and `alt` property shown when viewer is open              |
+| onClose               | function      | Callback which will be called when viewer is closed                               |
+| backgroundStyle       | CSSProperties | Object with custom styles for background of modal window                          |
+| captionStyle          | CSSProperties | Object with custom styles for caption text under image                            |
+| disableScroll         | boolean       | Disable scrolling images by mouse wheel                                           |
+| disableCaption        | boolean       | Do not show the caption under the image                                           |
+| closeOnClickOutside   | boolean       | Whether viewer should be closed when clicking outside of image                    |
+| closeOnClickInside    | boolean       | Whether viewer should be closed when clicking inside image                        |
+| closeComponent        | JSX.Element   | Custom component for the close button                                             |
+| leftArrowComponent    | JSX.Element   | Custom component for the left arrow                                               |
+| rightArrowComponent   | JSX.Element   | Custom component for the right arrow                                              |
+
 
 # Shortcuts
 
@@ -97,3 +112,8 @@ render(<App />, document.getElementById('app'));
 | Right Arrow / l | Next image                      |
 | Left Arrow / h  | Previous image                  |
 | Mouse wheel     | Scrolling previous / next image |
+
+
+# Forked from original repository
+
+[Github Repository](https://github.com/specter256/react-simple-image-viewer)