Switch to always using a wrapping view.

This will now support using borderRadius within style for cropping for all corners
on iOS and Android in react-native@0.54.1.

FastImage.js

@@ -51,30 +51,8 @@ class FastImage extends Component {
 
     const resolvedSource = resolveAssetSource(source)
 
-    if (children) {
-      throw new Error(
-        'The <FastImage> component cannot contain children. If you want to render content on top of the image consider using absolute positioning.',
-      )
-    }
-
-    if (!borderRadius) {
     return (
-        <FastImageView
-          ref={e => (this._root = e)}
-          {...props}
-          style={style}
-          source={resolvedSource}
-          onFastImageLoadStart={onLoadStart}
-          onFastImageProgress={onProgress}
-          onFastImageLoad={onLoad}
-          onFastImageError={onError}
-          onFastImageLoadEnd={onLoadEnd}
-        />
-      )
-    }
-
-    return (
-      <View style={[style, styles.imageContainer]} borderRadius={borderRadius}>
+      <View style={[style, styles.imageContainer]}>
         <FastImageView
           ref={e => (this._root = e)}
           {...props}
@@ -86,6 +64,11 @@ class FastImage extends Component {
           onFastImageError={onError}
           onFastImageLoadEnd={onLoadEnd}
         />
+        {children && (
+          <View style={StyleSheet.absoluteFill}>
+            {children}
+          </View>
+        )}
       </View>
     )
   }

react-native-fast-image-example/fastImage/BorderRadiusExample.js

@@ -16,14 +16,12 @@ const BorderRadiusExample = ({ onPressReload, bust }) => (
     <SectionFlex onPress={onPressReload}>
       <FastImage
         style={styles.imageSquare}
-        borderRadius={50}
         source={{
           uri: IMAGE_URL + bust,
         }}
       />
       <FastImage
         style={styles.imageRectangular}
-        borderRadius={50}
         source={{
           uri: IMAGE_URL + bust,
         }}
@@ -34,6 +32,7 @@ const BorderRadiusExample = ({ onPressReload, bust }) => (
 
 const styles = StyleSheet.create({
   imageSquare: {
+    borderRadius: 50,
     height: 100,
     backgroundColor: '#ddd',
     margin: 20,
@@ -41,6 +40,9 @@ const styles = StyleSheet.create({
     flex: 0,
   },
   imageRectangular: {
+    borderRadius: 50,
+    borderTopLeftRadius: 10,
+    borderBottomRightRadius: 10,
     height: 100,
     backgroundColor: '#ddd',
     margin: 20,