{"_id":"@astrocoders/react-modal-image","_rev":"9-1466cf1e6baf768bcbff00637b3818f6","name":"@astrocoders/react-modal-image","dist-tags":{"latest":"2.1.7"},"versions":{"2.1.5":{"name":"@astrocoders/react-modal-image","version":"2.1.5","description":"Lightweight Lightbox React Component","main":"lib/index.js","module":"es/index.js","files":["es","lib"],"scripts":{"build":"nwb build-react-component","site":"gh-pages -d demo/dist","clean":"nwb clean-module && nwb clean-demo","start":"nwb serve-react-demo -p 8888","start:static":"http-server demo/dist/ -s -p 8888","cypress:open":"cypress open","cypress:run":"cypress run","test":"start-server-and-test start:static http://localhost:8888 cypress:run"},"peerDependencies":{"react":"16.x"},"devDependencies":{"cypress":"^1.4.1","gh-pages":"^1.1.0","http-server":"^0.11.1","nwb":"0.21.x","react":"^16.2.0","react-dom":"^16.2.0","start-server-and-test":"^1.0.0"},"repository":{"type":"git","url":"https://github.com/astrocoders/react-modal-image"},"author":{"name":"Ari Autio","email":"ari.autio@iki.fi"},"license":"MIT","keywords":["react-component","lightbox","modal","image","react"],"_id":"@astrocoders/react-modal-image@2.1.5","dist":{"shasum":"5718c0874a9e5d48afa1f86390561cb2da78da60","tarball":"https://registry.npmjs.org/@astrocoders/react-modal-image/-/react-modal-image-2.1.5.tgz","fileCount":17,"unpackedSize":39110,"integrity":"sha512-PR6AKrVUpMmw7joC21q/fb+0Uj/KgVKhNt1qnXGIh8coTbdaEn85GssRxtvlAd7yzz7JC173ATKlBXIkvYKTwg==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCOAvme2P2qVZ/D7Ne/G6a8YYFWwwwIhXN8lxDmhZqFpAIgSZBbugGTtfUChLvB/WWo9Bf6gUlM5iWZ8WDZA/RebZo="}]},"maintainers":[{"name":"gabrielrubens","email":"grsabreu@gmail.com"},{"name":"georgelima","email":"georgelima11@hotmail.com"},{"name":"guilhermedecampo","email":"guilherme.decampo@astrocoders.com"},{"name":"jabur","email":"guilhermejabur@outlook.com"},{"name":"sandroqz","email":"sandroqz@gmail.com"}],"_npmUser":{"name":"guilhermedecampo","email":"guilherme.decampo@astrocoders.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-modal-image_2.1.5_1532035225440_0.977371004906048"},"_hasShrinkwrap":false},"2.1.6":{"name":"@astrocoders/react-modal-image","version":"2.1.6","description":"Lightweight Lightbox React Component","main":"lib/index.js","module":"es/index.js","files":["es","lib"],"scripts":{"build":"nwb build-react-component","site":"gh-pages -d demo/dist","clean":"nwb clean-module && nwb clean-demo","start":"nwb serve-react-demo -p 8888","start:static":"http-server demo/dist/ -s -p 8888","cypress:open":"cypress open","cypress:run":"cypress run","test":"start-server-and-test start:static http://localhost:8888 cypress:run"},"peerDependencies":{"react":"16.x"},"devDependencies":{"cypress":"^1.4.1","gh-pages":"^1.1.0","http-server":"^0.11.1","nwb":"0.21.x","react":"^16.2.0","react-dom":"^16.2.0","start-server-and-test":"^1.0.0"},"repository":{"type":"git","url":"https://github.com/astrocoders/react-modal-image"},"author":{"name":"Ari Autio","email":"ari.autio@iki.fi"},"license":"MIT","keywords":["react-component","lightbox","modal","image","react"],"_id":"@astrocoders/react-modal-image@2.1.6","dist":{"shasum":"3df0baa126e83a0e608dfc59902f4fbfb5b16804","tarball":"https://registry.npmjs.org/@astrocoders/react-modal-image/-/react-modal-image-2.1.6.tgz","fileCount":17,"unpackedSize":39110,"integrity":"sha512-fQ23zLW1ztdOZq4kFuTBBfNXR4Z9n9C6yBL68G8t3Nxj3hbaXub5aC3a0i0+iAerMrG/d/OFl1VzWU6teVhKWA==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIG4D6T+0pqPeHJuToRQv77BpP5wyvEJVstbgenyxNH/qAiBqu6XLINw7CUuxexcfFgv/UrAuae79CbWYDrXdwhDzhw=="}]},"maintainers":[{"name":"gabrielrubens","email":"grsabreu@gmail.com"},{"name":"georgelima","email":"georgelima11@hotmail.com"},{"name":"guilhermedecampo","email":"guilherme.decampo@astrocoders.com"},{"name":"jabur","email":"guilhermejabur@outlook.com"},{"name":"sandroqz","email":"sandroqz@gmail.com"}],"_npmUser":{"name":"guilhermedecampo","email":"guilherme.decampo@astrocoders.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-modal-image_2.1.6_1532106105155_0.6085683987634722"},"_hasShrinkwrap":false},"2.1.7":{"name":"@astrocoders/react-modal-image","version":"2.1.7","description":"Lightweight Lightbox React Component","main":"lib/index.js","module":"es/index.js","files":["es","lib"],"scripts":{"build":"nwb build-react-component","site":"gh-pages -d demo/dist","clean":"nwb clean-module && nwb clean-demo","start":"nwb serve-react-demo -p 8888","start:static":"http-server demo/dist/ -s -p 8888","cypress:open":"cypress open","cypress:run":"cypress run","test":"start-server-and-test start:static http://localhost:8888 cypress:run"},"peerDependencies":{"react":"16.x"},"devDependencies":{"cypress":"^1.4.1","gh-pages":"^1.1.0","http-server":"^0.11.1","nwb":"0.21.x","react":"^16.2.0","react-dom":"^16.2.0","start-server-and-test":"^1.0.0"},"repository":{"type":"git","url":"https://github.com/astrocoders/react-modal-image"},"author":{"name":"Ari Autio","email":"ari.autio@iki.fi"},"license":"MIT","keywords":["react-component","lightbox","modal","image","react"],"_id":"@astrocoders/react-modal-image@2.1.7","dist":{"shasum":"69a87afea2f42093c1729a2cc8fa195030e9a2bf","tarball":"https://registry.npmjs.org/@astrocoders/react-modal-image/-/react-modal-image-2.1.7.tgz","fileCount":17,"unpackedSize":39110,"integrity":"sha512-4FZR9gLnIW5VxhXuTwAgDGZPX5u0f0zsg8Nab+THujQpj/V4CDxo/2U5ZliEr972rKAYEWUBpihgIBDQUcYvGw==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIDau3sSwhlPfXm+A/Snpn6cIsflTc+sgRcQHJ6pZ7w3kAiEAtTcfYVzxJ0fmsBMA5W+LCYFfbjrdUL50MrQ2QDiD76I="}]},"maintainers":[{"name":"gabrielrubens","email":"grsabreu@gmail.com"},{"name":"georgelima","email":"georgelima11@hotmail.com"},{"name":"guilhermedecampo","email":"guilherme.decampo@astrocoders.com"},{"name":"jabur","email":"guilhermejabur@outlook.com"},{"name":"sandroqz","email":"sandroqz@gmail.com"}],"_npmUser":{"name":"guilhermedecampo","email":"guilherme.decampo@astrocoders.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-modal-image_2.1.7_1532106439276_0.9304196397477744"},"_hasShrinkwrap":false}},"time":{"created":"2018-07-19T21:20:25.373Z","2.1.5":"2018-07-19T21:20:25.521Z","modified":"2022-06-12T14:49:31.060Z","2.1.6":"2018-07-20T17:01:45.227Z","2.1.7":"2018-07-20T17:07:19.431Z"},"maintainers":[{"email":"gameplayteam12@gmail.com","name":"luizmoratelli"},{"email":"yuri.fabris@gmail.com","name":"yurijean"},{"email":"lucassilvabesen@gmail.com","name":"lucasbesen"},{"email":"eliabesajunior@gmail.com","name":"eliabejr"},{"email":"medsonoliveira@outlook.com.br","name":"medson10"},{"email":"grsabreu@gmail.com","name":"gabrielrubens"},{"email":"georgelima11@hotmail.com","name":"georgelima"},{"email":"guilherme.decampo@astrocoders.com","name":"guilhermedecampo"}],"description":"Lightweight Lightbox React Component","keywords":["react-component","lightbox","modal","image","react"],"repository":{"type":"git","url":"https://github.com/astrocoders/react-modal-image"},"author":{"name":"Ari Autio","email":"ari.autio@iki.fi"},"license":"MIT","readme":"# react-modal-image\n\n[![CircleCI][build-badge]][build]\n[![npm package][npm-badge]][npm]\n\nA _lightweight_ React component providing modal image Lightbox.\n\n[DEMO](https://aautio.github.io/react-modal-image/)\n\n## Features\n\n- Only _3 kB_ when gzipped.\n- Zero dependencies.\n- Includes builds for CommonJS and ES modules.\n- For React 15.x and 16.x.\n- Esc, Enter & click outside the image close the lightbox\n- User can zoom & move the image or download the highest quality one\n- Image alt shown as title of lightbox\n\nYou need to bring your own `Set` polyfill if you use old Internet Explorers.\n\n## Simple API\n\n```js\nimport ModalImage from 'react-modal-image'\n\n<ModalImage\n  small={urlToTinyImageFile}\n  large={urlToHugeImageFile}\n  alt=\"Hello World!\"\n/>\n```\n\n| Prop                | Type      | Description                                                                         |\n| ------------------- | --------- | ----------------------------------------------------------------------------------- |\n| `className`         | `String`  | Optional. `class` for the small preview image.                                      |\n| `alt`               | `String`  | Optional. `alt` for the small image and the heading text in Lightbox.               |\n| `small`             | `URL`     | `src` for the small preview image.                                                  |\n| `smallSrcSet`       | `String`  | Optional. `srcSet` for the small preview image.                                     |\n| `medium`            | `URL`     | Optional if `large` is defined. Image shown when zoomed out in Lightbox.            |\n| `large`             | `URL`     | Optional if `medium` is defined. Image shown when zoomed in Lightbox. Downloadable. |\n| `hasDownloadButton` | `Boolean` | Optional. Show download button in LightBox if set `true`                            |\n\n## Lightbox-only API\n\nYou can also choose to import only the Lightbox.\n\nTo use the Lightbox only, you'll need to handle the open state by yourself:\n\n```js\nimport { Lightbox } from 'react-modal-image'\n\n// ...\n\nconst closeLightbox = () => {\n  this.state.open = true\n}\n\n// ...\n\n{\n  this.state.open && (\n    <Lightbox medium={urlToLargeImageFile} large={urlToHugeImageFile} alt=\"Hello World!\" onClose={this.closeLightbox} />\n  )\n}\n```\n\n| Prop      | Type       | Description                                             |\n| --------- | ---------- | ------------------------------------------------------- |\n| `onClose` | `function` | Will be invoked when the Lightbox requests to be closed |\n\n[build-badge]: https://img.shields.io/circleci/project/github/aautio/react-modal-image.svg\n[build]: https://circleci.com/gh/aautio/react-modal-image\n[npm-badge]: https://img.shields.io/npm/v/react-modal-image.svg\n[npm]: https://www.npmjs.org/package/react-modal-image\n","readmeFilename":"README.md"}