Image Zoom Versions Save

[5.1.5] - 2023-04-23

Fixed

• Possibly broke zooming divs where role="img" (#412)

[5.1.4] - 2023-04-17

Fixed

• Older browser versions querySelector error (#391)
• Cannot read properties of undefined (reading 'left') with Zoom Component and React SVG Component in Docusaurus (#406)
• Warning: NaN is an invalid value for the width css style property. (#375)

[5.1.3] - 2023-02-25

Fixed

• Image has already been loaded (https://github.com/rpearce/react-medium-image-zoom/pull/389)

[5.1.2] - 2022-10-25

Fixed

• Image is hidden when pressing escape during hiding animation (issue #378)

[5.1.1] - 2022-10-14

Fixed

• zoomMargin portion of "Neither zoomMargin nor scrollableEl seem to be working correctly" (issue #350)
• Clicking on zoomed SVGs doesn't unzoom (issue #369)

[5.1.0] - 2022-10-11

Added

• Ability to customize the zoom modal content via <ZoomContent> (issue #332)
• Re-added wrapElement prop to API; only supports 'div' | 'span' (issue #356)
• Added a11y support for prefers-reduced-motion: reduce (issue #359)
• Added classDialog string prop to account for the loss of granular styling control over different modals resulting from moving the <dialog> rendering to a portal

Changed

• Now rendering <dialog> in a portal because of #356
  • For the folx using .my-class [data-rmiz-modal] {} to change the <dialog> styles, please use the classDialog prop to pass my-class to the <dialog>. I wish I didn't have to do this, but this is something that needs fixing, and I can't justify a new major version just because of this new style requirement. The classDialog addition (mentioned above) should solve this nicely.

Fixed

• Now using the wheel event instead of scroll to detect trying to leave the modal (issue #350)
• Fixed mobile scrolling experience (related to issue #350)

Removed

• Removed the broken scrollableEl that has arguably not ever worked (issue #350)

[5.0.3] - 2022-09-19

Fixed

• Missing class properties transform (#337) (potential issue versions of node older than LTS)

[5.0.2] - 2022-08-22

Fixed

• Not working with gatsby image plugin (StaticImage) (#347)

[5.0.1] - 2022-08-04

Fixed

• React hydration issue (#338)

[5.0.0] - 2022-08-03

Closes #164, #166, #213, #227, #259, #265, #281, #282

Added

• Added IconUnzoom and IconZoom in order to customize the zoom & unzoom buttons
• Added zoomImg to provide attributes for an image that should be loaded on zoom
• Added better zooming support for all of the following:
  • <img />, including all object-fit values, any object-position, and loading="lazy"
  • <div> and <span> with any background-image, background-size, and background-position
  • <picture> with <source /> and <img />
  • <figure> with <img />

Changed

• Sets "type": "module" in package.json for ESModule usage
• Renamed closeText to a11yNameButtonUnzoom
• Renamed openText to a11yNameButtonZoom
• Images must meet these querySelector criteria to be found:

  ':is(img, svg, [role="img"], [data-zoom]):not([aria-hidden="true"])'
  

Removed

• Removed focus-options-polyfill dependency
• Removed tslib dependency
• Removed overlayBgColorStart (now specified via CSS: [data-rmiz-modal-overlay="hidden"])
• Removed overlayBgColorEnd (now specified via CSS: [data-rmiz-modal-overlay="visible"])
• Removed portalEl
• Removed transitionDuration (now specified via CSS: [data-rmiz-modal-overlay] and [data-rmiz-modal-img])
• Removed wrapElement
• Removed wrapStyle
• Removed zoomZIndex