yarn add galeria

Fixes new architecture issues. Requires a new native build since this includes new native code.

What's Changed

• add RCT_NEW_ARCH_ENABLED compiler flag by @intergalacticspacehighway in #31

Full Changelog: v1.1.0...v1.2.0

Upgrade Guide

yarn add @nandorojo/galeria

Next, be sure to rebuild your native app + development client, since this has native code changes.

What's Changed

This version fixes issues on the new architecture with the built-in Image from react-native, as well as adding new features and fixes.

• fix link color by @alantoa in #21
• Optimise setup calls with view lifecycle OnViewDidUpdateProps by @intergalacticspacehighway in #23
• feat: Add the option to use closeIconName on ios by @fedorish in #24
• Add edge-to-edge support by @zoontek in #18
• fix: (ios) view recycling in fabric by @intergalacticspacehighway in #25
• Fix Android build by @hirbod in #27

New Contributors

• @intergalacticspacehighway made their first contribution in #23
• @fedorish made their first contribution in #24
• @zoontek made their first contribution in #18
• @hirbod made their first contribution in #27

Full Changelog: v1.0.0...v1.1.0

Galeria 1 📸

We're out of beta!

yarn add @nandorojo/galeria

Features

• New Architecture Support (thanks to @hirbod + @intergalacticspacehighway) - see #17
• Stable web support - see #15 #14

Galeria now truly works with any image component.

As stated in the README, Web has a slimmer feature set than native. Previous versions of Galeria Web had odd distortions when the image expanded and struggled with virtualized lists. Those issues have been addressed with this web rewrite.

Bring your own image

The API feels beautiful:

import { Galeria } from '@nandorojo/galeria'
import { Image } from 'react-native' // works with ANY image component!

const url = 'https://my-image.com/image.jpg'

export const SingleImage = ({ style }) => (
  <Galeria urls={[url]}>
    <Galeria.Image>
      <Image source={{ uri: url }} style={style} />
    </Galeria.Image>
  </Galeria>
)

Multiple Images:

import { Galeria } from '@nandorojo/galeria'
import { Image } from 'react-native' // works with ANY image component!

import localImage from './assets/local-image.png'

const urls = ['https://my-image.com/image.jpg', localImage]

export const MutliImage = ({ style }) => (
  <Galeria urls={urls}>
    {urls.map((url, index) => (
       <Galeria.Image index={index} key={...}>
         <Image source={typeof url === 'string' ? { uri: url } : url} style={style} />
       </Galeria.Image>
     )}
  </Galeria>
)

You can use any image component you want

Each platform will detect the first image instance that is the child of Galeria.Image and make it pressable. The expanded images will correspond to the urls prop passed to Galeria.

Web support was rewritten in 0.5. It should work better with all kinds of images/aspect ratios. And if you use it incorrectly, it should give you nicer warnings.

This version also matches the README, which was reported to not be matching. Please try it out and let me know how this works!

If it looks good, we just need a few touches to get to 1.0...