{"repo":"rpearce/react-medium-image-zoom","free":true,"listed":false,"github":"https://github.com/rpearce/react-medium-image-zoom","clone":"git clone https://github.com/rpearce/react-medium-image-zoom.git","description":"🔎 🏞 The original medium.com-inspired image zooming library for React (since 2016)","language":"TypeScript","stars":2116,"topics":["image-zoom","medium","react","props","zoom","react-images","zoom-images","zoomable","typescript","reactjs"],"license":"BSD-3-Clause","category":"media-processing","readme_excerpt":"react-medium-image-zoom The original medium.com-inspired image zooming library for React. View the storybook examples to see various usages. Features: - , including all object-fit values, any object-position , and loading=\"lazy\" - and with any background-image , background-size , and background-position - with and - with - - Custom zoom modal content (👇) - Accessibility: - JAWS in Chrome, Edge, and Firefox (Windows) - NVDA in Chrome, Edge, and Firefox (Windows) - VoiceOver in Safari (macOS, iOS) - TalkBack in Chrome (Android) - Supports popular tools: - Gatsby and gatsby-plugin-image - Next.js - Zero dependencies Requirements to know about: - element (caniuse dialog) - ResizeObserver (caniuse ResizeObserver) - Package build target is ES2021 . If you need to support older environments, run this package through your build system. Media and Tutorials - 2024-08-2024 — React Round Up — \"Building a Seamless Image Zoom Feature\" - Build a React.js Image Zoom Feature with react-medium-image-zoom Library and State Management Quickstart API You can pass these options to either the Uncontrolled (default) or Controlled components. You can pass these options to only the Controlled component. Basic Usage Uncontrolled component (default) Import the component and the CSS, wrap your image with the component, and the component will handle it's own state. Controlled component Import the Controlled component and the CSS, wrap your image with the component, and then dictate the isZoomed state to ","default_branch":null,"files":null,"tree":[],"storefront":"/r/rpearce","claimed":false,"request_supported":{"post":"https://gitbuyer.com/r/rpearce/react-medium-image-zoom/request-supported","requests":0},"note":"indexed from public GitHub; nothing is for sale on this page. Clone it from GitHub. Paid listings live at /search."}