version 4

New version (V4)

Improvements

• Add video support, now the gallery supports 2 types of media - image and video, the video element contains all the options that the image has.
• Lightbox support in the video element.
• Add a callback function called onClick when clicking on a media element.
• Change library variables names and functions to be aligned with both image and video.
• Update all package dependencies to their latest version.
• Fix some bugs related to media style/className props.
• Other improvements and bug fixes.

Breaking change

Gallery options:

• Rename images prop to media.
• Rename numOfImagesPerRow prop to numOfMediaPerRow.
• Rename imageMaxWidth prop to mediaMaxWidth.
• Rename imagesPaddingBottom prop to mediaPaddingBottom.
• Rename imagesStyle prop to mediaStyle.
• Rename selectableItems prop to selectableMedia.
• Rename mediaPaddingBottom to mediaMarginBottom

Media(Image previously) options:

• Add type prop - could be image or video where the default is image.
• Add mediaStyle prop to support style object for specific media element .
• Add videoType prop to support style object for specific media element .
• Add additionalVideoProps prop to get more video properties. .
• Rename imgClassName prop to mediaClassName.

viteJS, error, loader, lightbox package and other improvements (#33) @OriAmir

• Change webpack to ViteJS as a package bundler.
• Update all packages to their latest version
• Build only with ESModules.
• Change the lightbox component to yet-another-react-lightbox which is more updated and newer than the old deprecated one we used before.
• Add a Loader option to show when the image is loaded.
• Add an Error option to show when image load is failed.
• Load the lightbox components only if useLightBox property is true.
• Don't show the select(checkbox) option until the image is loaded.
• Memo images if they have not changed.

Change lightBoxAdditionalProps relvant props

Thanks to @choozn we fix an issue where some props from react-image-lightbox are not relevant as props to the this library.

These properties are not available to send as additional props (because we already using them internally):
mainSrc, nextSrc, prevSrc, onCloseRequest, onMovePrevRequest, onMoveNextRequest
If you want to pass imageTitle or imageCaption you can pass that via the img props.

I added this section to the readme under Using Lightbox.

Add alt option to image

• Add alt prop to image element ( thanks to VidiHawk for the comment )
• Some small code changes

Bug fixes

• Fix a bug where the images max-width does not work properly in some different cases.
• Fix a bug where the Select input was in the wrong location if the image's max-width was defined and different from 100%.
• Add StackBlitz as a playground.

Select feature and other changes

• Add a new feature of images select.
• Change the folder structure to a more understood and clear structure.
• Add more tests to the library including the hooks.
• Add CI/CD flow using GitHub actions.

Typescript support and improvements

• Library rewrite in TypeScript.
• Arranged and improved the code.
• Added tests using React-Testing-Library.

Code arrange and improvements

-Add prettier and fix ESLint.
-Remove unnecessary dependencies and add them to the dev Dependencies.
-Remove unnecessary files.
-Added new unit tests
-Arrange Webpack file.

Add lightbox support ,bug fixes

1.2.1

bug fix