theanam / react-awesome-lightbox Goto Github PK

When I try to open any image it is stretched. I don't know why it is happening.
I am using version [email protected]
npm version: 8.19.3
reactjs version

onNavigateImage functionality seems to be missing on the new build.

Could be related to https://github.com/theanam/react-awesome-lightbox/runs/3389418877

Can you add the example code into the repository?

Thanks! 🦆🦆🦆🦆

The image is selected (with an annoying blue tint) by pressing quickly on the next or previous image, as quickly as a double click. It does not happen in all browsers. For example it happens in Firefox, but not in Chrome. It can be fixed by adding the following to the img style:

userSelect: "none"

hey i like this project! and maybe its my own misunderstanding but the example of usage just has the props of image and title being passed. do i need to pass anything else for the single image lightbox to have initial state as closed and a function to handle the closing of lightbox?

Great code. Thank you for sharing. I'm working with React and have included the code successfully. The only issue is the gallery does not close when hitting the X. The other buttons work. Rotate, zoom as such. Just X won't work. Please advise.

Is there a way to explicitly open the light-box on an event, if so to include in docs.

i'm using vite 3 ,
locally everything work fine but after build or in production

i'm facing this issue ,

Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: [missing argument].[missing argument]

any suggestion to fix this issue

note : images is links from aws

**vite can't build pkg with default export

npm v7+ wont allow package to be installed with react v17+ due to conflicting peer dependency.

Needs update.

Steps to reproduce:

Update react to 18.
Use npm i react-awesome-lightbox

Expected:
Successfull installation

Actual:
peer react@"^16||^17" from [email protected]

Steps to reproduce:

1. You need 2 images
2. Select the first one, zoom in and drag it out of center and leave it there
3. Select the second one, zoom in and start dragging
4. Your image jumps

I guess when you end dragging you have to reset initX, initY or lastX, lastY or both. I'm not sure about that.

Code:
{isImageViewerOpen && (
<Lightbox
images={images}
startIndex={imageIndex}
onClose={() => setIsImageViewerOpen(false)}
/>
)}

A wide image is cut off after 90 degree transform. Is it intentional to not have a scroll on the modal? (overflow:hidden)
Only means to see the entire image is to hit the zoom icon and then drag the image around

What's happening
opened lightbox, it fetches image x and display
then I press next it fetches image y and display

Everything is fine till this point
but when I go to the previous image (image x), it again fetches the image through the API call

Expected Behaviour
when we go back to the already visited image, it shouldn't fetch that image again
instead, it should support caching and get from cache or any better way so that don't have to wait for image to come from server over the api call again.
**caching can be done for some time limit