react-native-fast-image 8.6.20 → 8.6.22

package/dist/index.cjs.js

@@ -51,7 +51,29 @@ const resolveDefaultSource = defaultSource => {
 
 
   return defaultSource;
-};
+}; // Finds tintColor in a style prop, where the last style that sets it wins, as
+// with StyleSheet.flatten, but without flattening (which allocates a merged
+// object for an array style on every render).
+
+
+function tintColorFromStyle(style) {
+  if (Array.isArray(style)) {
+    for (let i = style.length - 1; i >= 0; i--) {
+      const found = tintColorFromStyle(style[i]);
+      if (found !== undefined) return found;
+    }
+
+    return undefined;
+  }
+
+  if (typeof style === 'number') {
+    // A registered style from StyleSheet.create on older React Native.
+    const flattened = reactNative.StyleSheet.flatten(style);
+    return flattened ? flattened.tintColor : undefined;
+  }
+
+  return style && typeof style === 'object' ? style.tintColor : undefined;
+}
 
 function FastImageBase({
   source,
@@ -84,7 +106,10 @@ function FastImageBase({
   const wrapperProps = {
     onLayout,
     onClick
-  };
+  }; // tintColor can also be set in style, as with React Native's Image. The
+  // prop wins.
+
+  const resolvedTintColor = tintColor != null ? tintColor : tintColorFromStyle(style);
 
   if (fallback) {
     // Remove `cache`, which React Native's Image doesn't support. A
@@ -98,8 +123,8 @@ function FastImageBase({
     }, wrapperProps, {
       ref: forwardedRef
     }), /*#__PURE__*/React__default['default'].createElement(reactNative.Image, _extends__default['default']({}, props, {
-      style: [reactNative.StyleSheet.absoluteFill, {
-        tintColor
+      style: [styles.fallbackImage, {
+        tintColor: resolvedTintColor
       }],
       source: resolvedSource,
       defaultSource: defaultSource,
@@ -119,7 +144,7 @@ function FastImageBase({
   }, wrapperProps, {
     ref: forwardedRef
   }), /*#__PURE__*/React__default['default'].createElement(FastImageView, _extends__default['default']({}, props, {
-    tintColor: tintColor,
+    tintColor: resolvedTintColor,
     style: reactNative.StyleSheet.absoluteFill,
     source: resolvedSource,
     defaultSource: resolvedDefaultSource,
@@ -149,6 +174,15 @@ FastImage.clearMemoryCache = () => reactNative.NativeModules.FastImageView.clear
 FastImage.clearDiskCache = () => reactNative.NativeModules.FastImageView.clearDiskCache();
 
 const styles = reactNative.StyleSheet.create({
+  // React Native's Image sizes itself from a require()d source's width and
+  // height unless the style sets them, which would override absoluteFill.
+  fallbackImage: {
+    position: 'absolute',
+    top: 0,
+    left: 0,
+    width: '100%',
+    height: '100%'
+  },
   imageContainer: {
     overflow: 'hidden'
   }

package/dist/index.d.ts

@@ -52,6 +52,7 @@ export interface ImageStyle extends ViewStyle {
     borderTopLeftRadius?: number;
     borderTopRightRadius?: number;
     overlayColor?: ColorValue;
+    tintColor?: ColorValue;
     opacity?: number;
 }
 export interface FastImageProps extends AccessibilityProps, ViewProps {

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA2B,MAAM,OAAO,CAAA;AAC/C,OAAO,EAMH,iBAAiB,EACjB,SAAS,EACT,SAAS,EACT,kBAAkB,EAElB,kBAAkB,EAClB,SAAS,EACZ,MAAM,cAAc,CAAA;AAKrB,aAAK,UAAU,GAAG,WAAW,CAAC,SAAS,CAAC,iBAAiB,CAAC,CAAC,CAAA;AAE3D,oBAAY,UAAU,GAAG,SAAS,GAAG,OAAO,GAAG,SAAS,GAAG,QAAQ,CAAA;AAEnE,QAAA,MAAM,UAAU;;;;;CAKN,CAAA;AAEV,oBAAY,QAAQ,GAAG,KAAK,GAAG,QAAQ,GAAG,MAAM,CAAA;AAEhD,QAAA,MAAM,QAAQ;;;;CAIJ,CAAA;AAEV,oBAAY,KAAK,GAAG,WAAW,GAAG,KAAK,GAAG,WAAW,CAAA;AAErD,QAAA,MAAM,YAAY;;;;CAOR,CAAA;AAEV,oBAAY,MAAM,GAAG;IACjB,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,OAAO,CAAC,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAA;KAAE,CAAA;IACnC,QAAQ,CAAC,EAAE,QAAQ,CAAA;IACnB,KAAK,CAAC,EAAE,KAAK,CAAA;CAChB,CAAA;AAED,MAAM,WAAW,WAAW;IACxB,WAAW,EAAE;QACT,KAAK,EAAE,MAAM,CAAA;QACb,MAAM,EAAE,MAAM,CAAA;QAGd,MAAM,CAAC,EAAE,MAAM,CAAA;KAClB,CAAA;CACJ;AAED,MAAM,WAAW,eAAe;IAC5B,WAAW,EAAE;QACT,MAAM,EAAE,MAAM,CAAA;QACd,KAAK,EAAE,MAAM,CAAA;KAChB,CAAA;CACJ;AAID,MAAM,WAAW,UAAW,SAAQ,SAAS;IACzC,kBAAkB,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAA;IACzC,sBAAsB,CAAC,EAAE,MAAM,CAAA;IAC/B,uBAAuB,CAAC,EAAE,MAAM,CAAA;IAChC,eAAe,CAAC,EAAE,UAAU,CAAA;IAC5B,WAAW,CAAC,EAAE,UAAU,CAAA;IACxB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,mBAAmB,CAAC,EAAE,MAAM,CAAA;IAC5B,oBAAoB,CAAC,EAAE,MAAM,CAAA;IAC7B,YAAY,CAAC,EAAE,UAAU,CAAA;IACzB,SAAS,CAAC,EAAE,UAAU,CAAA;IACtB,OAAO,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,MAAM,WAAW,cAAe,SAAQ,kBAAkB,EAAE,SAAS;IACjE,MAAM,CAAC,EAAE,MAAM,GAAG,kBAAkB,CAAA;IACpC,aAAa,CAAC,EAAE,kBAAkB,CAAA;IAClC,UAAU,CAAC,EAAE,UAAU,CAAA;IACvB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAElB,WAAW,CAAC,IAAI,IAAI,CAAA;IAEpB,UAAU,CAAC,CAAC,KAAK,EAAE,eAAe,GAAG,IAAI,CAAA;IAEzC,MAAM,CAAC,CAAC,KAAK,EAAE,WAAW,GAAG,IAAI,CAAA;IAEjC,OAAO,CAAC,IAAI,IAAI,CAAA;IAEhB,SAAS,CAAC,IAAI,IAAI,CAAA;IAElB;;;;;;OAMG;IACH,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,IAAI,CAAA;IAE7C;;;OAGG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,UAAU,CAAC,CAAA;IAE7B;;;;OAIG;IAEH,SAAS,CAAC,EAAE,UAAU,CAAA;IAEtB;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,CAAA;IAEf;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CAC7B;AAuJD,MAAM,WAAW,yBAAyB;IACtC,UAAU,EAAE,OAAO,UAAU,CAAA;IAC7B,QAAQ,EAAE,OAAO,QAAQ,CAAA;IACzB,YAAY,EAAE,OAAO,YAAY,CAAA;IACjC,OAAO,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,KAAK,IAAI,CAAA;IACpC,gBAAgB,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAA;IACrC,cAAc,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAA;CACtC;AAED,QAAA,MAAM,SAAS,EAAE,KAAK,CAAC,aAAa,CAAC,cAAc,CAAC,GAChD,yBAAqD,CAAA;AA8CzD,eAAe,SAAS,CAAA"}

package/dist/index.js

@@ -44,7 +44,29 @@ const resolveDefaultSource = defaultSource => {
 
 
   return defaultSource;
-};
+}; // Finds tintColor in a style prop, where the last style that sets it wins, as
+// with StyleSheet.flatten, but without flattening (which allocates a merged
+// object for an array style on every render).
+
+
+function tintColorFromStyle(style) {
+  if (Array.isArray(style)) {
+    for (let i = style.length - 1; i >= 0; i--) {
+      const found = tintColorFromStyle(style[i]);
+      if (found !== undefined) return found;
+    }
+
+    return undefined;
+  }
+
+  if (typeof style === 'number') {
+    // A registered style from StyleSheet.create on older React Native.
+    const flattened = StyleSheet.flatten(style);
+    return flattened ? flattened.tintColor : undefined;
+  }
+
+  return style && typeof style === 'object' ? style.tintColor : undefined;
+}
 
 function FastImageBase({
   source,
@@ -77,7 +99,10 @@ function FastImageBase({
   const wrapperProps = {
     onLayout,
     onClick
-  };
+  }; // tintColor can also be set in style, as with React Native's Image. The
+  // prop wins.
+
+  const resolvedTintColor = tintColor != null ? tintColor : tintColorFromStyle(style);
 
   if (fallback) {
     // Remove `cache`, which React Native's Image doesn't support. A
@@ -91,8 +116,8 @@ function FastImageBase({
     }, wrapperProps, {
       ref: forwardedRef
     }), /*#__PURE__*/React.createElement(Image, _extends({}, props, {
-      style: [StyleSheet.absoluteFill, {
-        tintColor
+      style: [styles.fallbackImage, {
+        tintColor: resolvedTintColor
       }],
       source: resolvedSource,
       defaultSource: defaultSource,
@@ -112,7 +137,7 @@ function FastImageBase({
   }, wrapperProps, {
     ref: forwardedRef
   }), /*#__PURE__*/React.createElement(FastImageView, _extends({}, props, {
-    tintColor: tintColor,
+    tintColor: resolvedTintColor,
     style: StyleSheet.absoluteFill,
     source: resolvedSource,
     defaultSource: resolvedDefaultSource,
@@ -142,6 +167,15 @@ FastImage.clearMemoryCache = () => NativeModules.FastImageView.clearMemoryCache(
 FastImage.clearDiskCache = () => NativeModules.FastImageView.clearDiskCache();
 
 const styles = StyleSheet.create({
+  // React Native's Image sizes itself from a require()d source's width and
+  // height unless the style sets them, which would override absoluteFill.
+  fallbackImage: {
+    position: 'absolute',
+    top: 0,
+    left: 0,
+    width: '100%',
+    height: '100%'
+  },
   imageContainer: {
     overflow: 'hidden'
   }

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "react-native-fast-image",
-    "version": "8.6.20",
+    "version": "8.6.22",
     "description": "🚩 FastImage, performant React Native image component.",
     "keywords": [
         "cache",