react-native-fast-image 8.6.19 → 8.6.21
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs.js +32 -4
- package/dist/index.d.ts +6 -4
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +32 -4
- package/package.json +1 -1
package/dist/index.cjs.js
CHANGED
|
@@ -9,6 +9,9 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
|
|
|
9
9
|
var _extends__default = /*#__PURE__*/_interopDefaultLegacy(_extends);
|
|
10
10
|
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
11
11
|
|
|
12
|
+
// from ViewStyle so the types also work with older React Native types, where
|
|
13
|
+
// it's string.
|
|
14
|
+
|
|
12
15
|
const resizeMode = {
|
|
13
16
|
contain: 'contain',
|
|
14
17
|
cover: 'cover',
|
|
@@ -48,7 +51,29 @@ const resolveDefaultSource = defaultSource => {
|
|
|
48
51
|
|
|
49
52
|
|
|
50
53
|
return defaultSource;
|
|
51
|
-
};
|
|
54
|
+
}; // Finds tintColor in a style prop, where the last style that sets it wins, as
|
|
55
|
+
// with StyleSheet.flatten, but without flattening (which allocates a merged
|
|
56
|
+
// object for an array style on every render).
|
|
57
|
+
|
|
58
|
+
|
|
59
|
+
function tintColorFromStyle(style) {
|
|
60
|
+
if (Array.isArray(style)) {
|
|
61
|
+
for (let i = style.length - 1; i >= 0; i--) {
|
|
62
|
+
const found = tintColorFromStyle(style[i]);
|
|
63
|
+
if (found !== undefined) return found;
|
|
64
|
+
}
|
|
65
|
+
|
|
66
|
+
return undefined;
|
|
67
|
+
}
|
|
68
|
+
|
|
69
|
+
if (typeof style === 'number') {
|
|
70
|
+
// A registered style from StyleSheet.create on older React Native.
|
|
71
|
+
const flattened = reactNative.StyleSheet.flatten(style);
|
|
72
|
+
return flattened ? flattened.tintColor : undefined;
|
|
73
|
+
}
|
|
74
|
+
|
|
75
|
+
return style && typeof style === 'object' ? style.tintColor : undefined;
|
|
76
|
+
}
|
|
52
77
|
|
|
53
78
|
function FastImageBase({
|
|
54
79
|
source,
|
|
@@ -81,7 +106,10 @@ function FastImageBase({
|
|
|
81
106
|
const wrapperProps = {
|
|
82
107
|
onLayout,
|
|
83
108
|
onClick
|
|
84
|
-
};
|
|
109
|
+
}; // tintColor can also be set in style, as with React Native's Image. The
|
|
110
|
+
// prop wins.
|
|
111
|
+
|
|
112
|
+
const resolvedTintColor = tintColor != null ? tintColor : tintColorFromStyle(style);
|
|
85
113
|
|
|
86
114
|
if (fallback) {
|
|
87
115
|
// Remove `cache`, which React Native's Image doesn't support. A
|
|
@@ -96,7 +124,7 @@ function FastImageBase({
|
|
|
96
124
|
ref: forwardedRef
|
|
97
125
|
}), /*#__PURE__*/React__default['default'].createElement(reactNative.Image, _extends__default['default']({}, props, {
|
|
98
126
|
style: [reactNative.StyleSheet.absoluteFill, {
|
|
99
|
-
tintColor
|
|
127
|
+
tintColor: resolvedTintColor
|
|
100
128
|
}],
|
|
101
129
|
source: resolvedSource,
|
|
102
130
|
defaultSource: defaultSource,
|
|
@@ -116,7 +144,7 @@ function FastImageBase({
|
|
|
116
144
|
}, wrapperProps, {
|
|
117
145
|
ref: forwardedRef
|
|
118
146
|
}), /*#__PURE__*/React__default['default'].createElement(FastImageView, _extends__default['default']({}, props, {
|
|
119
|
-
tintColor:
|
|
147
|
+
tintColor: resolvedTintColor,
|
|
120
148
|
style: reactNative.StyleSheet.absoluteFill,
|
|
121
149
|
source: resolvedSource,
|
|
122
150
|
defaultSource: resolvedDefaultSource,
|
package/dist/index.d.ts
CHANGED
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { LayoutChangeEvent, StyleProp, ViewStyle, ImageRequireSource, AccessibilityProps, ViewProps
|
|
2
|
+
import { LayoutChangeEvent, StyleProp, ViewStyle, ImageRequireSource, AccessibilityProps, ViewProps } from 'react-native';
|
|
3
|
+
declare type ColorValue = NonNullable<ViewStyle['backgroundColor']>;
|
|
3
4
|
export declare type ResizeMode = 'contain' | 'cover' | 'stretch' | 'center';
|
|
4
5
|
declare const resizeMode: {
|
|
5
6
|
readonly contain: "contain";
|
|
@@ -44,13 +45,14 @@ export interface ImageStyle extends ViewStyle {
|
|
|
44
45
|
backfaceVisibility?: 'visible' | 'hidden';
|
|
45
46
|
borderBottomLeftRadius?: number;
|
|
46
47
|
borderBottomRightRadius?: number;
|
|
47
|
-
backgroundColor?:
|
|
48
|
-
borderColor?:
|
|
48
|
+
backgroundColor?: ColorValue;
|
|
49
|
+
borderColor?: ColorValue;
|
|
49
50
|
borderWidth?: number;
|
|
50
51
|
borderRadius?: number;
|
|
51
52
|
borderTopLeftRadius?: number;
|
|
52
53
|
borderTopRightRadius?: number;
|
|
53
|
-
overlayColor?:
|
|
54
|
+
overlayColor?: ColorValue;
|
|
55
|
+
tintColor?: ColorValue;
|
|
54
56
|
opacity?: number;
|
|
55
57
|
}
|
|
56
58
|
export interface FastImageProps extends AccessibilityProps, ViewProps {
|
package/dist/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"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,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":"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"}
|
package/dist/index.js
CHANGED
|
@@ -2,6 +2,9 @@ import _extends from '@babel/runtime/helpers/extends';
|
|
|
2
2
|
import React, { forwardRef, memo } from 'react';
|
|
3
3
|
import { NativeModules, StyleSheet, requireNativeComponent, Image, View, Platform } from 'react-native';
|
|
4
4
|
|
|
5
|
+
// from ViewStyle so the types also work with older React Native types, where
|
|
6
|
+
// it's string.
|
|
7
|
+
|
|
5
8
|
const resizeMode = {
|
|
6
9
|
contain: 'contain',
|
|
7
10
|
cover: 'cover',
|
|
@@ -41,7 +44,29 @@ const resolveDefaultSource = defaultSource => {
|
|
|
41
44
|
|
|
42
45
|
|
|
43
46
|
return defaultSource;
|
|
44
|
-
};
|
|
47
|
+
}; // Finds tintColor in a style prop, where the last style that sets it wins, as
|
|
48
|
+
// with StyleSheet.flatten, but without flattening (which allocates a merged
|
|
49
|
+
// object for an array style on every render).
|
|
50
|
+
|
|
51
|
+
|
|
52
|
+
function tintColorFromStyle(style) {
|
|
53
|
+
if (Array.isArray(style)) {
|
|
54
|
+
for (let i = style.length - 1; i >= 0; i--) {
|
|
55
|
+
const found = tintColorFromStyle(style[i]);
|
|
56
|
+
if (found !== undefined) return found;
|
|
57
|
+
}
|
|
58
|
+
|
|
59
|
+
return undefined;
|
|
60
|
+
}
|
|
61
|
+
|
|
62
|
+
if (typeof style === 'number') {
|
|
63
|
+
// A registered style from StyleSheet.create on older React Native.
|
|
64
|
+
const flattened = StyleSheet.flatten(style);
|
|
65
|
+
return flattened ? flattened.tintColor : undefined;
|
|
66
|
+
}
|
|
67
|
+
|
|
68
|
+
return style && typeof style === 'object' ? style.tintColor : undefined;
|
|
69
|
+
}
|
|
45
70
|
|
|
46
71
|
function FastImageBase({
|
|
47
72
|
source,
|
|
@@ -74,7 +99,10 @@ function FastImageBase({
|
|
|
74
99
|
const wrapperProps = {
|
|
75
100
|
onLayout,
|
|
76
101
|
onClick
|
|
77
|
-
};
|
|
102
|
+
}; // tintColor can also be set in style, as with React Native's Image. The
|
|
103
|
+
// prop wins.
|
|
104
|
+
|
|
105
|
+
const resolvedTintColor = tintColor != null ? tintColor : tintColorFromStyle(style);
|
|
78
106
|
|
|
79
107
|
if (fallback) {
|
|
80
108
|
// Remove `cache`, which React Native's Image doesn't support. A
|
|
@@ -89,7 +117,7 @@ function FastImageBase({
|
|
|
89
117
|
ref: forwardedRef
|
|
90
118
|
}), /*#__PURE__*/React.createElement(Image, _extends({}, props, {
|
|
91
119
|
style: [StyleSheet.absoluteFill, {
|
|
92
|
-
tintColor
|
|
120
|
+
tintColor: resolvedTintColor
|
|
93
121
|
}],
|
|
94
122
|
source: resolvedSource,
|
|
95
123
|
defaultSource: defaultSource,
|
|
@@ -109,7 +137,7 @@ function FastImageBase({
|
|
|
109
137
|
}, wrapperProps, {
|
|
110
138
|
ref: forwardedRef
|
|
111
139
|
}), /*#__PURE__*/React.createElement(FastImageView, _extends({}, props, {
|
|
112
|
-
tintColor:
|
|
140
|
+
tintColor: resolvedTintColor,
|
|
113
141
|
style: StyleSheet.absoluteFill,
|
|
114
142
|
source: resolvedSource,
|
|
115
143
|
defaultSource: resolvedDefaultSource,
|