import FacePile from 'react-native-face-pile'

const FACES = [
  {
    id: 0,
    imageUrl: 'https://s3.amazonaws.com/uifaces/faces/twitter/vista/128.jpg',
  },
  {
    id: 1,
    imageUrl: 'http://www.yojackets.com/wp-content/uploads/2016/04/Civil-War-Scarlet-Witch-Red-Coat-1.jpg',
  },
  {
    id: 2,
    imageUrl: 'https://s3.amazonaws.com/uifaces/faces/twitter/brad_frost/128.jpg',
  },
  {
    id: 3,
    imageUrl: 'https://s3.amazonaws.com/uifaces/faces/twitter/k/128.jpg',
  },
  {
    id: 4,
    imageUrl: 'https://pbs.twimg.com/profile_images/885357926373654528/4tGgnF71_bigger.jpg',
  }
];

<FacePile numFaces={3} faces={FACES} />

render: PropTypes.func, // optional render method, otherwise we take control
numFaces: PropTypes.number, // number of faces you want to render. The rest is subtracted
hideOverflow: PropTypes.bool, // whether or not to show the +2 extra faces
overlap: PropTypes.number, // optional amount of overlap of faces (between 0 and 1), defaults to 0.5
faces: PropTypes.shape({
  id: PropTypes.string,
  imageUrl: PropTypes.string
}),
circleSize: PropTypes.number, // 20, 40, 60, etc.
containerStyle: PropTypes.instanceOf(StyleSheet), // overall container style
circleStyle: PropTypes.instanceOf(StyleSheet), // override default circle styles
imageStyle: PropTypes.instanceOf(StyleSheet), // override default image styles
overflowStyle: PropTypes.instanceOf(StyleSheet), // override default overflow circle styles
overflowLabelStyle: PropTypes.instanceOf(StyleSheet) // override default overflow label (+8) styles