@draftbit/core 50.6.4-97b460.2 → 50.6.4-b6cc35.2
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/lib/commonjs/components/ExpoImage.js +1 -1
- package/lib/typescript/src/components/ExpoImage.d.ts +5 -10
- package/lib/typescript/src/components/ExpoImage.js +12 -4
- package/lib/typescript/src/components/ExpoImage.js.map +1 -1
- package/lib/typescript/tsconfig.tsbuildinfo +1 -1
- package/package.json +3 -3
- package/src/components/ExpoImage.js +12 -4
- package/src/components/ExpoImage.js.map +1 -1
- package/src/components/ExpoImage.tsx +31 -27
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@draftbit/core",
|
|
3
|
-
"version": "50.6.4-
|
|
3
|
+
"version": "50.6.4-b6cc35.2+b6cc35b",
|
|
4
4
|
"description": "Core (non-native) Components",
|
|
5
5
|
"main": "lib/commonjs/index.js",
|
|
6
6
|
"types": "lib/typescript/src/index.d.ts",
|
|
@@ -42,7 +42,7 @@
|
|
|
42
42
|
"@date-io/date-fns": "^1.3.13",
|
|
43
43
|
"@dotlottie/react-player": "1.6.1",
|
|
44
44
|
"@draftbit/react-theme-provider": "^2.1.1",
|
|
45
|
-
"@draftbit/theme": "^50.6.4-
|
|
45
|
+
"@draftbit/theme": "^50.6.4-b6cc35.2+b6cc35b",
|
|
46
46
|
"@expo/vector-icons": "^14.0.0",
|
|
47
47
|
"@gorhom/bottom-sheet": "5.0.0-alpha.7",
|
|
48
48
|
"@lottiefiles/react-lottie-player": "3.5.3",
|
|
@@ -123,5 +123,5 @@
|
|
|
123
123
|
],
|
|
124
124
|
"testEnvironment": "node"
|
|
125
125
|
},
|
|
126
|
-
"gitHead": "
|
|
126
|
+
"gitHead": "b6cc35b133f2e1697392965b65e33d99ed5cbbd9"
|
|
127
127
|
}
|
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
/* README: Internal Image component used for stuff like Card. DO NOT EXPORT! */
|
|
2
1
|
import React from "react";
|
|
3
2
|
import { StyleSheet } from "react-native";
|
|
4
3
|
import { Image, } from "expo-image";
|
|
@@ -38,7 +37,7 @@ const resizeModeToContentFit = (resizeMode) => {
|
|
|
38
37
|
};
|
|
39
38
|
return (_a = mapping[resizeMode]) !== null && _a !== void 0 ? _a : "cover";
|
|
40
39
|
};
|
|
41
|
-
const ExpoImage = ({ source, resizeMode = "cover", style,
|
|
40
|
+
const ExpoImage = ({ source, resizeMode = "cover", style, transitionDuration = 300, transitionEffect = "cross-dissolve", transitionTiming = "ease-in-out", contentFit = "cover", contentPosition = "center", cachePolicy = "memory-disk", allowDownscaling = true, blurRadius, blurhash, ...props }) => {
|
|
42
41
|
let imageSource = source === null || source === undefined
|
|
43
42
|
? Config.placeholderImageURL
|
|
44
43
|
: source;
|
|
@@ -47,9 +46,16 @@ const ExpoImage = ({ source, resizeMode = "cover", style, placeholder, transitio
|
|
|
47
46
|
const finalContentFit = resizeMode
|
|
48
47
|
? resizeModeToContentFit(resizeMode)
|
|
49
48
|
: contentFit;
|
|
49
|
+
const transition = {
|
|
50
|
+
timing: transitionTiming,
|
|
51
|
+
duration: transitionDuration,
|
|
52
|
+
effect: transitionEffect,
|
|
53
|
+
};
|
|
50
54
|
if (aspectRatio) {
|
|
51
55
|
return (React.createElement(AspectRatio, { style: [style, { width, height, aspectRatio }] },
|
|
52
|
-
React.createElement(Image, { ...props, source: imageSource, contentFit: finalContentFit, placeholder:
|
|
56
|
+
React.createElement(Image, { ...props, source: imageSource, contentFit: finalContentFit, placeholder: {
|
|
57
|
+
blurhash,
|
|
58
|
+
}, transition: transition, contentPosition: contentPosition, cachePolicy: cachePolicy, allowDownscaling: allowDownscaling, blurRadius: blurRadius, style: [
|
|
53
59
|
style,
|
|
54
60
|
{
|
|
55
61
|
height: "100%",
|
|
@@ -57,7 +63,9 @@ const ExpoImage = ({ source, resizeMode = "cover", style, placeholder, transitio
|
|
|
57
63
|
},
|
|
58
64
|
] })));
|
|
59
65
|
}
|
|
60
|
-
return (React.createElement(Image, { ...props, source: source, contentFit: finalContentFit, placeholder:
|
|
66
|
+
return (React.createElement(Image, { ...props, source: source, contentFit: finalContentFit, placeholder: {
|
|
67
|
+
blurhash,
|
|
68
|
+
}, transition: transition, contentPosition: contentPosition, cachePolicy: cachePolicy, allowDownscaling: allowDownscaling, blurRadius: blurRadius, style: style }));
|
|
61
69
|
};
|
|
62
70
|
export default ExpoImage;
|
|
63
71
|
//# sourceMappingURL=ExpoImage.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ExpoImage.js","sourceRoot":"","sources":["ExpoImage.tsx"],"names":[],"mappings":"AAAA
|
|
1
|
+
{"version":3,"file":"ExpoImage.js","sourceRoot":"","sources":["ExpoImage.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
/* README: Internal Image component used for stuff like Card. DO NOT EXPORT! */
|
|
2
1
|
import React from "react";
|
|
3
2
|
import { StyleSheet, ImageSourcePropType, DimensionValue } from "react-native";
|
|
4
3
|
import {
|
|
@@ -17,29 +16,22 @@ type ImageStyleProp = {
|
|
|
17
16
|
};
|
|
18
17
|
|
|
19
18
|
interface ExtendedImageProps extends ExpoImageProps {
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
|
26
|
-
|
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
| "flip-from-top"
|
|
31
|
-
| "flip-from-right"
|
|
32
|
-
| "flip-from-bottom"
|
|
33
|
-
| "flip-from-left"
|
|
34
|
-
| "curl-up"
|
|
35
|
-
| "curl-down";
|
|
36
|
-
timing?: "ease-in-out" | "ease-in" | "ease-out" | "linear";
|
|
37
|
-
};
|
|
19
|
+
transitionDuration?: number;
|
|
20
|
+
transitionEffect?:
|
|
21
|
+
| "cross-dissolve"
|
|
22
|
+
| "flip-from-top"
|
|
23
|
+
| "flip-from-right"
|
|
24
|
+
| "flip-from-bottom"
|
|
25
|
+
| "flip-from-left"
|
|
26
|
+
| "curl-up"
|
|
27
|
+
| "curl-down";
|
|
28
|
+
transitionTiming?: "ease-in-out" | "ease-in" | "ease-out" | "linear";
|
|
38
29
|
contentFit?: "cover" | "contain" | "fill" | "none" | "scale-down";
|
|
39
30
|
contentPosition?: ImageContentPosition;
|
|
40
31
|
cachePolicy?: "none" | "disk" | "memory" | "memory-disk";
|
|
41
32
|
allowDownscaling?: boolean;
|
|
42
|
-
|
|
33
|
+
blurRadius?: number;
|
|
34
|
+
blurhash?: string;
|
|
43
35
|
}
|
|
44
36
|
|
|
45
37
|
const generateDimensions = ({
|
|
@@ -94,13 +86,15 @@ const ExpoImage: React.FC<ExtendedImageProps> = ({
|
|
|
94
86
|
source,
|
|
95
87
|
resizeMode = "cover",
|
|
96
88
|
style,
|
|
97
|
-
|
|
98
|
-
|
|
89
|
+
transitionDuration = 300,
|
|
90
|
+
transitionEffect = "cross-dissolve",
|
|
91
|
+
transitionTiming = "ease-in-out",
|
|
99
92
|
contentFit = "cover",
|
|
100
93
|
contentPosition = "center",
|
|
101
94
|
cachePolicy = "memory-disk",
|
|
102
95
|
allowDownscaling = true,
|
|
103
|
-
|
|
96
|
+
blurRadius,
|
|
97
|
+
blurhash,
|
|
104
98
|
...props
|
|
105
99
|
}) => {
|
|
106
100
|
let imageSource =
|
|
@@ -117,6 +111,12 @@ const ExpoImage: React.FC<ExtendedImageProps> = ({
|
|
|
117
111
|
? resizeModeToContentFit(resizeMode)
|
|
118
112
|
: contentFit;
|
|
119
113
|
|
|
114
|
+
const transition = {
|
|
115
|
+
timing: transitionTiming,
|
|
116
|
+
duration: transitionDuration,
|
|
117
|
+
effect: transitionEffect,
|
|
118
|
+
};
|
|
119
|
+
|
|
120
120
|
if (aspectRatio) {
|
|
121
121
|
return (
|
|
122
122
|
<AspectRatio style={[style, { width, height, aspectRatio }]}>
|
|
@@ -124,12 +124,14 @@ const ExpoImage: React.FC<ExtendedImageProps> = ({
|
|
|
124
124
|
{...props}
|
|
125
125
|
source={imageSource as ImageSourcePropType}
|
|
126
126
|
contentFit={finalContentFit}
|
|
127
|
-
placeholder={
|
|
127
|
+
placeholder={{
|
|
128
|
+
blurhash,
|
|
129
|
+
}}
|
|
128
130
|
transition={transition}
|
|
129
131
|
contentPosition={contentPosition}
|
|
130
132
|
cachePolicy={cachePolicy}
|
|
131
133
|
allowDownscaling={allowDownscaling}
|
|
132
|
-
|
|
134
|
+
blurRadius={blurRadius}
|
|
133
135
|
style={[
|
|
134
136
|
style,
|
|
135
137
|
{
|
|
@@ -147,12 +149,14 @@ const ExpoImage: React.FC<ExtendedImageProps> = ({
|
|
|
147
149
|
{...props}
|
|
148
150
|
source={source as ImageSourcePropType}
|
|
149
151
|
contentFit={finalContentFit}
|
|
150
|
-
placeholder={
|
|
152
|
+
placeholder={{
|
|
153
|
+
blurhash,
|
|
154
|
+
}}
|
|
151
155
|
transition={transition}
|
|
152
156
|
contentPosition={contentPosition}
|
|
153
157
|
cachePolicy={cachePolicy}
|
|
154
158
|
allowDownscaling={allowDownscaling}
|
|
155
|
-
|
|
159
|
+
blurRadius={blurRadius}
|
|
156
160
|
style={style}
|
|
157
161
|
/>
|
|
158
162
|
);
|