{"_id":"42-react-native-awesome-gallery","name":"42-react-native-awesome-gallery","dist-tags":{"latest":"0.3.5"},"versions":{"0.3.5":{"name":"42-react-native-awesome-gallery","version":"0.3.5","description":"Awesome gallery with Reanimated v2","main":"lib/commonjs/index","module":"lib/module/index","types":"lib/typescript/index.d.ts","react-native":"src/index","source":"src/index","scripts":{"test":"jest","typescript":"tsc --noEmit","lint":"eslint \"**/*.{js,ts,tsx}\"","release":"release-it","example":"yarn --cwd example","pods":"cd example && pod-install --quiet","bootstrap":"yarn example && yarn && yarn pods"},"keywords":["react-native","ios","android"],"repository":{"type":"git","url":"git+https://github.com/xz870603611/42-react-native-awesome-gallery.git"},"author":{"name":"pavelbabenko","email":"pavelbabenko01@gmail.com","url":"https://github.com/pavelbabenko"},"license":"MIT","bugs":{"url":"https://github.com/Flair-Dev/react-native-awesome-gallery/issues"},"homepage":"https://github.com/Flair-Dev/react-native-awesome-gallery#readme","publishConfig":{"registry":"https://registry.npmjs.org/"},"dependencies":{"react-native-redash":"^16.0.8"},"devDependencies":{"@commitlint/config-conventional":"^11.0.0","@react-native-community/eslint-config":"^2.0.0","@release-it/conventional-changelog":"^2.0.0","@types/jest":"^26.0.0","@types/react":"^16.9.19","@types/react-native":"0.62.13","eslint":"^7.2.0","eslint-config-prettier":"^7.0.0","eslint-plugin-prettier":"^3.1.3","husky":"^4.2.5","jest":"^26.0.1","pod-install":"^0.1.0","prettier":"^2.0.5","react":"16.13.1","react-native":"0.63.4","react-native-builder-bob":"^","react-native-gesture-handler":"2.3.0","react-native-reanimated":"2.3.3","react-native-redash":"^16.0.8","release-it":"^14.2.2","typescript":"^4.1.3"},"peerDependencies":{"react":"*","react-native":"*","react-native-gesture-handler":"^2.0.0","react-native-reanimated":"^2.0.0"},"jest":{"preset":"react-native","modulePathIgnorePatterns":["/example/node_modules","/lib/"]},"husky":{"hooks":{"pre-commit":"yarn lint && yarn typescript"}},"release-it":{"git":{"commitMessage":"chore: release ${version}","tagName":"v${version}"},"npm":{"publish":true},"github":{"release":true},"plugins":{"@release-it/conventional-changelog":{"preset":"angular"}}},"eslintConfig":{"root":true,"extends":["@react-native-community","prettier"],"rules":{"prettier/prettier":["error",{"quoteProps":"consistent","singleQuote":true,"tabWidth":2,"trailingComma":"es5","useTabs":false}]}},"eslintIgnore":["node_modules/","lib/"],"prettier":{"quoteProps":"consistent","singleQuote":true,"tabWidth":2,"trailingComma":"es5","useTabs":false},"react-native-builder-bob":{"source":"src","output":"lib","targets":["commonjs","module",["typescript",{"project":"tsconfig.build.json"}]]},"gitHead":"768643ad47bce24e15c36ef82a59850370282b32","_id":"42-react-native-awesome-gallery@0.3.5","_nodeVersion":"16.15.1","_npmVersion":"8.11.0","dist":{"integrity":"sha512-yJruP76EqjD2XoBxKzCG7CY/JoXYLEK8gU/lHxO5RWUOV34pZ9DZgMlMpLErcWLys45ghSVjELDTaSekHrL4qw==","shasum":"7f3df5880b211900a2e91ea5b3994714bf755fa5","tarball":"https://registry.npmjs.org/42-react-native-awesome-gallery/-/42-react-native-awesome-gallery-0.3.5.tgz","fileCount":27,"unpackedSize":257594,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQC0pDexp/G3XPKCQq/EkXxd3KfCh0ubo83gsaPaO2uNXwIhAJ8qrXhXtD0eHcKAILD0Nrg8FZGEOMhymeThB3VY2Shf"}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJjTibhACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqM0Q//Uk7xl1h+O+W+hdvohco/4L1kuVqzZWi4vYzKVokOA42lj8eF\r\njaif8SBQ0EML71O/rKzlb2+0H4sZQY5A7MH2YCTiicZ90G1f9hqiURaTb28f\r\na3LoR9DyjIE12E17kRCQzVI4aifj8eJEuMWUVo7fLxN2fJDcQh/o51E4+FBE\r\nqt4zUm9VozEL6pUmsh6JgZpMgPKtMoRTVnv7KhQrW5yfjKcOIqSFfwIRnVUO\r\npk8KNnQ15LeAiAlB61XObQsOM5zhxzWNVTuFhhamK2b82jxnY27gVfl69FHd\r\nMKMtkATE9bl4h6rzAYvz3JkEuqDXNsOeGf4cX1fWwCg7LRazq+ujhdSa5XQP\r\n4+mW0sMIE6pblOpAt8CqUF034Dl+vqEfmNE/WN9j6ZmUa2PliGxfj3wfO/I8\r\n4Dw6iL7FUzUSIpiVZNerUVkkXbOM++LWUmIDTskUlJZX7M/MZ1ziZ8ivYQQf\r\nGc9fojAxgT1T8CVjXqQ0ZcLmEiI3d1cVptn26lEe//OCrEMFn2yejzNOxgs2\r\ngPIyfmScTWzC6m4ymtUYEz1wI6iynjzBt8VcqTjmBxoaJaDgiWaYgBm15eE5\r\nwbRXQfMMuclBcGn6WGdDRuLqpj7ee+Lmy4qv1OgdsF0KQSqe3qEWOnJFOP0Y\r\nOVhI2Xw/kYiblsbXf7XLWhvGoT+x61HaHMg=\r\n=jmbG\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"xz87060361","email":"xz87060361@126.com"},"directories":{},"maintainers":[{"name":"xz87060361","email":"xz87060361@126.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/42-react-native-awesome-gallery_0.3.5_1666066145008_0.8678768939363672"},"_hasShrinkwrap":false}},"time":{"created":"2022-10-18T04:09:05.008Z","0.3.5":"2022-10-18T04:09:05.228Z","modified":"2022-10-18T04:09:05.363Z"},"maintainers":[{"name":"xz87060361","email":"xz87060361@126.com"}],"description":"Awesome gallery with Reanimated v2","homepage":"https://github.com/Flair-Dev/react-native-awesome-gallery#readme","keywords":["react-native","ios","android"],"repository":{"type":"git","url":"git+https://github.com/xz870603611/42-react-native-awesome-gallery.git"},"author":{"name":"pavelbabenko","email":"pavelbabenko01@gmail.com","url":"https://github.com/pavelbabenko"},"bugs":{"url":"https://github.com/Flair-Dev/react-native-awesome-gallery/issues"},"license":"MIT","readme":"[![npm version](https://badge.fury.io/js/react-native-awesome-gallery.svg)](https://badge.fury.io/js/react-native-awesome-gallery)\n\n
\n

React Native Awesome Gallery

\n

Photos gallery powered by Reanimated v2 and react-native-gesture-handler

\n
\n\n\n \n \n \n \n \n \n \n \n \n \n

Basic usage

With toolbar

Loop

\"Gallery\"Gallery\"Gallery
\n\n## Supported features\n\n- Zoom to scale\n- Double tap to scale\n- Native iOS feeling (rubber effect, decay animation on pan gesture)\n- RTL support\n- Fully customizable\n- Both orientations (portrait + landscape)\n- Infinite list\n- Supports both iOS and Android.\n\n## Installation\n\n> **_Note:_** Starting from v0.3.0 using Gesture Handler v2 is required\n\nFirst you have to follow installation instructions of [Reanimated v2](https://docs.swmansion.com/react-native-reanimated/) and [react-native-gesture-handler](https://docs.swmansion.com/react-native-gesture-handler/)\n\n```sh\nyarn add react-native-awesome-gallery\n```\n\nExpo is supported since SDK 40. More information [here](https://docs.expo.io/versions/latest/sdk/reanimated/)\n\n## Usage\n\nCheck out an [example folder](./example) for example with Shared transition + `FastImage`\n\n```js\nimport Gallery from 'react-native-awesome-gallery';\n\n// ...\n\nconst images = ['https://image1', 'https://image2'];\n\nreturn (\n {\n console.log(newIndex);\n }}\n />\n);\n```\n\n## Props\n\n| Prop | Description | Type | Default |\n| -------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------ | ---------------------------------------------------------------------- |\n| data | Array of items to render | `T[]` | `undefined` |\n| renderItem? | Callback func which can be used to render custom image component, e.g `FastImage`. NOTE: You have to call `setImageDimensions({width, height})` parameter after image is loaded | `(renderItemInfo: {item: T, index: number, setImageDimensions: Function}) => React.ReactElement` | `undefined` |\n| keyExtractor? | Callback func which provides unique keys for items | `(item: T, index: number) => string or number` | Takes `id` or `key` or `_id` from `Item`, otherwise puts `Item` as key |\n| initialIndex? | The initial image index | `number` | `0` |\n| onIndexChange? | Is called when index of active item is changed | `(newIndex: number) => void` | `undefined` |\n| numToRender? | Amount of items rendered in gallery simultaneously | `number` | `5` |\n| emptySpaceWidth? | Width of empty space between items | `number` | `30` |\n| doubleTapScale? | Image scale when double tap is fired | `number` | `3` |\n| doubleTapInterval? | Time in milliseconds between single and double tap events | `number` | `500` |\n| maxScale? | Maximum scale user can set with gesture | `number` | `6` |\n| pinchEnabled? | Is pinch gesture enabled | `boolean` | `true` |\n| disableTransitionOnScaledImage? | Disables transition to next/previous image when scale > 1 | `boolean` | `false` |\n| hideAdjacentImagesOnScaledImage? | Hides next and previous images when scale > 1 | `boolean` | `false` |\n| disableVerticalSwipe? | Disables vertical swipe when scale == 1 | `boolean` | `false` |\n| disableSwipeUp? | Disables swipe up when scale == 1 | `boolean` | `false` |\n| loop? | Allows user to swipe infinitely. Works when `data.length > 1` | `boolean` | `false` |\n| onScaleChange? | Is called when scale is changed | `(scale: number) => void` | `undefined` |\n| onScaleChangeRange? | Shows range of scale in which `onScaleChange` is called | `{start: number, end: number}` | `undefined` |\n| containerDimensions? | Dimensions object for the View that wraps gallery. | `{width: number, height: number}` | value returned from `useWindowDimensions()` hook. |\n| style? | Style of container | `ViewStyle` | `undefined` |\n\n## Events\n\n| Prop | Description | Type |\n| ------------------------- | ------------------------------------------------------------------------------------------------------------------------------ | ---------- |\n| onSwipeToClose | Fired when user swiped to top/bottom | `Function` |\n| onTap | Fired when user tap on image | `Function` |\n| onDoubleTap | Fired when user double tap on image | `Function` |\n| onLongPress | Fired when long press is detected | `Function` |\n| onScaleStart | Fired when pinch gesture starts | `Function` |\n| onScaleEnd(scale: number) | Fired when pinch gesture ends. Use case: add haptic feedback when user finished gesture with `scale > maxScale` or `scale < 1` | `Function` |\n| onPanStart | Fired when pan gesture starts | `Function` |\n\n## Methods\n\n```js\nimport Gallery, { GalleryRef } from 'react-native-awesome-gallery';\n\n// ...\n\nconst ref = useRef(null);\n```\n\n| Prop | Description | Type |\n| -------- | ------------------------- | ------------------------------ |\n| setIndex | Sets active index | `(newIndex: number) => void` |\n| reset | Resets scale, translation | `(animated?: boolean) => void` |\n\n## Supporting\n\nIf you want to support the library, you can buy me a coffee.\n\n[![\"Buy Me A Coffee\"](https://www.buymeacoffee.com/assets/img/custom_images/orange_img.png)](https://www.buymeacoffee.com/pavelbabenko)\n\n## License\n\nMIT\n","readmeFilename":"README.md"}