aautio / react-modal-image

A tiny React component providing modal image Lightbox.
https://aautio.github.io/react-modal-image/
MIT License
198 stars 64 forks source link

[BUG] Closing Lightbox of Zoomed Image with Click Away - Cannot read properties of undefined (reading 'x') #76

Open CSFelix opened 4 weeks ago

CSFelix commented 4 weeks ago

Steps to Reproduce

  1. open an image modal with lightbox:
const [showLightbox, setShowLightbox] = useState(true);

const handleCloseLightbox = () => {
  setTimeout(() => {
    setShowLightbox(false);
    if (setIsLightboxVisible) setIsLightboxVisible(false);
  }, 50);
};

{showLightbox && (
  <Lightbox
    smallSrcSet={smallImgSrc}
    medium={mediumImgSrc}
    large={largeImgSrc}
    alt={'Caption'}

    showRotate={true}
    onClose={handleCloseLightbox}
  />
)}
  1. Click on zoom button

image

  1. Click on any dimmed area to close the modal keeping the image zoomed

image

  1. The error will be triggered

image

image


Expected Behavior

Lightbox should close without triggering errors, as it does when closed by pressing ESC or by clicking the close (x) button.


Version