react-native-fast-image 9.3.7 → 10.0.0

package/dist/index.js

@@ -1,5 +1,5 @@
-import React, { forwardRef, memo, useRef } from "react";
-import { Image, NativeModules, Platform, StyleSheet, View, requireNativeComponent } from "react-native";
+import React, { Children, forwardRef, memo } from "react";
+import { Image, Platform, StyleSheet, TurboModuleRegistry, View, codegenNativeComponent } from "react-native";
 //#region src/constants.ts
 const resizeMode = {
 	contain: "contain",
@@ -34,13 +34,6 @@ function fromStyle(style, key) {
 	}
 	return style && typeof style === "object" ? style[key] : void 0;
 }
-const RESIZE_MODE_FIT = {
-	contain: "contain",
-	cover: "cover",
-	stretch: "fill",
-	center: "center",
-	repeat: "repeat"
-};
 const FITS = {
 	fill: true,
 	contain: true,
@@ -48,31 +41,204 @@ const FITS = {
 	none: true,
 	"scale-down": true
 };
-function resolveObjectFit(objectFit, style, resizeMode) {
-	var _RESIZE_MODE_FIT$resi;
+function resolveObjectFit(objectFit, style) {
 	const fit = objectFit != null ? objectFit : fromStyle(style, "objectFit");
-	if (fit && FITS[fit] === true) return fit;
-	return (_RESIZE_MODE_FIT$resi = RESIZE_MODE_FIT[resizeMode]) !== null && _RESIZE_MODE_FIT$resi !== void 0 ? _RESIZE_MODE_FIT$resi : "cover";
+	return fit && FITS[fit] === true ? fit : "cover";
+}
+//#endregion
+//#region src/warnings.ts
+const warned = /* @__PURE__ */ new Set();
+function warnOnce(key, message, level) {
+	if (!warned.has(key)) {
+		warned.add(key);
+		console[level](message);
+	}
+}
+function warnIfChildren(children) {
+	if (Children.toArray(children).length > 0) warnOnce("children", "react-native-fast-image: FastImage doesn't render children (since 10.0): use FastImageBackground for content over an image.", "error");
+}
+//#endregion
+//#region src/objectPosition.ts
+const START = {
+	fraction: 0,
+	offset: 0
+};
+const CENTER = {
+	fraction: .5,
+	offset: 0
+};
+const END = {
+	fraction: 1,
+	offset: 0
+};
+/** The default, `50% 50%`. */
+const CENTERED = {
+	x: CENTER,
+	y: CENTER
+};
+const NUMBER = /^[+-]?(?:\d+\.?\d*|\.\d+)(?:e[+-]?\d+)?$/i;
+function length(text) {
+	const lower = text.toLowerCase();
+	if (lower.endsWith("%")) {
+		const number = lower.slice(0, -1);
+		return NUMBER.test(number) ? {
+			fraction: Number(number) / 100,
+			offset: 0
+		} : null;
+	}
+	if (lower.endsWith("px")) {
+		const number = lower.slice(0, -2);
+		return NUMBER.test(number) ? {
+			fraction: 0,
+			offset: Number(number)
+		} : null;
+	}
+	return NUMBER.test(lower) && Number(lower) === 0 ? START : null;
+}
+function token(text) {
+	const lower = text.toLowerCase();
+	if (lower === "left" || lower === "right" || lower === "top" || lower === "bottom" || lower === "center") return { keyword: lower };
+	const axis = length(text);
+	return axis ? { length: axis } : null;
+}
+const X = {
+	left: START,
+	center: CENTER,
+	right: END
+};
+const Y = {
+	top: START,
+	center: CENTER,
+	bottom: END
+};
+const x = (t) => "length" in t ? t.length : X[t.keyword];
+const y = (t) => "length" in t ? t.length : Y[t.keyword];
+function fromEdge(edge, axis) {
+	return edge === "left" || edge === "top" ? axis : {
+		fraction: 1 - axis.fraction,
+		offset: -axis.offset || 0
+	};
+}
+function parse(text) {
+	const tokens = [];
+	for (const part of text.trim().split(/\s+/)) {
+		const t = token(part);
+		if (!t) return null;
+		tokens.push(t);
+	}
+	if (tokens.length === 1) {
+		const [a] = tokens;
+		if ("keyword" in a && (a.keyword === "top" || a.keyword === "bottom")) return {
+			x: CENTER,
+			y: Y[a.keyword]
+		};
+		return {
+			x: x(a),
+			y: CENTER
+		};
+	}
+	if (tokens.length === 2) {
+		const [a, b] = tokens;
+		const ax = x(a);
+		const by = y(b);
+		if (ax && by) return {
+			x: ax,
+			y: by
+		};
+		if ("keyword" in a && "keyword" in b) {
+			const bx = X[b.keyword];
+			const ay = Y[a.keyword];
+			if (bx && ay) return {
+				x: bx,
+				y: ay
+			};
+		}
+		return null;
+	}
+	if (tokens.length === 4) {
+		const [a, b, c, d] = tokens;
+		if (!("keyword" in a && "length" in b && "keyword" in c && "length" in d)) return null;
+		const horizontal = (k) => k === "left" || k === "right";
+		const vertical = (k) => k === "top" || k === "bottom";
+		if (horizontal(a.keyword) && vertical(c.keyword)) return {
+			x: fromEdge(a.keyword, b.length),
+			y: fromEdge(c.keyword, d.length)
+		};
+		if (vertical(a.keyword) && horizontal(c.keyword)) return {
+			x: fromEdge(c.keyword, d.length),
+			y: fromEdge(a.keyword, b.length)
+		};
+	}
+	return null;
+}
+const parsed = /* @__PURE__ */ new Map();
+function objectLength(value) {
+	if (typeof value === "number") return Number.isFinite(value) ? {
+		fraction: 0,
+		offset: value
+	} : null;
+	return typeof value === "string" && value.endsWith("%") ? length(value) : null;
+}
+/**
+* The position for objectPosition, or null if it isn't valid. A string is
+* CSS's syntax; an object has one of `top` and `bottom` and one of `left`
+* and `right`, each in points or a percentage, and a missing axis is
+* centered. Unset is centered.
+*/
+function resolveObjectPosition(position) {
+	if (position == null) return CENTERED;
+	if (typeof position === "string") {
+		let result = parsed.get(position);
+		if (result === void 0) {
+			result = parse(position);
+			if (parsed.size < 100) parsed.set(position, result);
+		}
+		return result;
+	}
+	if (typeof position !== "object") return null;
+	const edges = position;
+	const axis = (start, end) => {
+		const hasStart = edges[start] != null;
+		const hasEnd = edges[end] != null;
+		if (hasStart && hasEnd) return null;
+		if (!hasStart && !hasEnd) return CENTER;
+		const edge = hasStart ? start : end;
+		const value = objectLength(edges[edge]);
+		return value && fromEdge(edge, value);
+	};
+	const resolvedX = axis("left", "right");
+	const resolvedY = axis("top", "bottom");
+	return resolvedX && resolvedY ? {
+		x: resolvedX,
+		y: resolvedY
+	} : null;
+}
+/**
+* The position for objectPosition, or centered if it isn't valid (as CSS
+* ignores it), with a warning in development.
+*/
+function objectPositionOrCentered(position) {
+	const resolved = resolveObjectPosition(position);
+	if (resolved) return resolved;
+	if (typeof __DEV__ !== "undefined" && __DEV__) {
+		const value = JSON.stringify(position);
+		warnOnce(`objectPosition ${value}`, `react-native-fast-image: objectPosition ${value} isn't a position, so the image is centered. Use CSS's syntax with px or % (e.g. 'right 10px bottom 20%'), or { top | bottom, left | right } in points or percentages.`, "warn");
+	}
+	return CENTERED;
 }
 //#endregion
+//#region src/specs/FastImageViewNativeComponent.ts
+var FastImageViewNativeComponent_default = codegenNativeComponent("FastImageView");
+//#endregion
+//#region src/specs/NativeFastImageModule.ts
+var NativeFastImageModule_default = TurboModuleRegistry.get("FastImageModule");
+//#endregion
 //#region src/index.tsx
 const resolveDefaultSource = (defaultSource) => {
 	if (!defaultSource) return null;
-	if (Platform.OS === "android") {
-		const resolved = Image.resolveAssetSource(defaultSource);
-		if (resolved) return resolved.uri;
-		return null;
-	}
-	return defaultSource;
-};
-const NATIVE_RESIZE_MODE = {
-	fill: "stretch",
-	contain: "contain",
-	cover: "cover",
-	none: "none",
-	"scale-down": "scale-down",
-	center: "center",
-	repeat: "repeat"
+	const resolved = Image.resolveAssetSource(defaultSource);
+	if (!resolved) return null;
+	return Platform.OS === "android" ? resolved.uri : resolved;
 };
 function loopCount(loop) {
 	if (loop === void 0) return -1;
@@ -91,127 +257,81 @@ function loadResult(event) {
 		error: (_event$error = event.error) !== null && _event$error !== void 0 ? _event$error : "Failed to load the image"
 	};
 }
-function withProgress(onProgress) {
-	return onProgress && ((event) => {
-		const { loaded, total } = event.nativeEvent;
-		event.nativeEvent.progress = total > 0 ? Math.min(1, Math.max(0, loaded / total)) : 0;
-		onProgress(event);
-	});
+function handledEvents({ onLoadStart, onProgress, onLoad, onError, onLoadEnd }) {
+	return (onLoadStart ? 1 : 0) | (onProgress ? 2 : 0) | (onLoad ? 4 : 0) | (onError ? 8 : 0) | (onLoadEnd ? 16 : 0);
+}
+function usualFadeMs() {
+	return Platform.OS === "ios" ? 250 : 300;
 }
-const DEFAULT_FADE_MS = Platform.OS === "ios" ? 250 : 300;
-function transitionProps(transition) {
-	var _transition$duration;
-	const { duration, betweenImages, skipOnCacheHit } = typeof transition === "number" ? { duration: transition } : typeof transition === "object" && transition ? {
-		...transition,
-		duration: (_transition$duration = transition.duration) !== null && _transition$duration !== void 0 ? _transition$duration : DEFAULT_FADE_MS
-	} : { duration: transition ? DEFAULT_FADE_MS : 0 };
+const NO_TRANSITION = {
+	transitionDuration: 0,
+	transitionBetweenImages: false,
+	transitionSkipOnCacheHit: "memory"
+};
+function resolveTransition(transition, base) {
+	if (transition == null) return base;
+	if (transition === false) return {
+		...base,
+		transitionDuration: 0
+	};
+	const usual = base.transitionDuration > 0 ? base.transitionDuration : usualFadeMs();
+	if (transition === true) return {
+		...base,
+		transitionDuration: usual
+	};
+	const { duration, betweenImages, skipOnCacheHit } = typeof transition === "number" ? { duration: transition } : transition;
+	const resolvedDuration = duration !== null && duration !== void 0 ? duration : usual;
 	return {
-		transitionDuration: typeof duration === "number" && duration > 0 ? duration : 0,
-		transitionBetweenImages: !!betweenImages,
-		transitionSkipOnCacheHit: skipOnCacheHit || "memory"
+		transitionDuration: typeof resolvedDuration === "number" && resolvedDuration > 0 ? resolvedDuration : 0,
+		transitionBetweenImages: betweenImages !== null && betweenImages !== void 0 ? betweenImages : base.transitionBetweenImages,
+		transitionSkipOnCacheHit: skipOnCacheHit !== null && skipOnCacheHit !== void 0 ? skipOnCacheHit : base.transitionSkipOnCacheHit
 	};
 }
-function withoutCache(source) {
-	const { cache: _cache, ...rest } = source || {};
-	return rest;
+function builtInTransition() {
+	return resolveTransition(Platform.OS === "android", NO_TRANSITION);
 }
-function FastImageBase({ source, defaultSource, tintColor, onLoadStart, onProgress, onLoad, onError, onLoadEnd, style, fallback, children, objectFit, resizeMode = "cover", loop, transition, forwardedRef, onLayout, pointerEvents, hitSlop, onStartShouldSetResponder, onStartShouldSetResponderCapture, onMoveShouldSetResponder, onMoveShouldSetResponderCapture, onResponderGrant, onResponderReject, onResponderStart, onResponderMove, onResponderEnd, onResponderRelease, onResponderTerminationRequest, onResponderTerminate, onTouchStart, onTouchMove, onTouchEnd, onTouchCancel, onTouchEndCapture, ...viewProps }) {
-	const { onClick, ...props } = viewProps;
-	const fallbackResult = useRef(void 0);
-	const wrapperProps = {
-		onLayout,
-		onClick,
-		pointerEvents,
-		hitSlop,
-		onStartShouldSetResponder,
-		onStartShouldSetResponderCapture,
-		onMoveShouldSetResponder,
-		onMoveShouldSetResponderCapture,
-		onResponderGrant,
-		onResponderReject,
-		onResponderStart,
-		onResponderMove,
-		onResponderEnd,
-		onResponderRelease,
-		onResponderTerminationRequest,
-		onResponderTerminate,
-		onTouchStart,
-		onTouchMove,
-		onTouchEnd,
-		onTouchCancel,
-		onTouchEndCapture
-	};
-	const imageProps = {
-		...props,
-		pointerEvents: pointerEvents === "box-none" ? "none" : void 0
-	};
+let defaultTransition;
+function FastImageBase({ source, defaultSource, tintColor, onLoadStart, onProgress, onLoad, onError, onLoadEnd, style, children, objectFit, objectPosition, loop, transition, forwardedRef, ...viewProps }) {
+	var _props$recyclingKey, _defaultTransition;
+	const { fallback, resizeMode: _resizeMode, ...props } = viewProps;
+	if (__DEV__ && fallback !== void 0) warnOnce("fallback", "react-native-fast-image: `fallback` was removed in 10.0, and does nothing: images always load natively. Remove it, or use React Native's Image for those images.", "warn");
+	if (__DEV__) warnIfChildren(children);
 	const resolvedTintColor = tintColor != null ? tintColor : fromStyle(style, "tintColor");
-	const mode = NATIVE_RESIZE_MODE[resolveObjectFit(objectFit, style, resizeMode)];
-	if (fallback) {
-		const cleanedSource = typeof source === "number" ? source : Array.isArray(source) ? source.map(withoutCache) : withoutCache(source);
-		const resolvedSource = Image.resolveAssetSource(cleanedSource);
-		return /* @__PURE__ */ React.createElement(View, {
-			style: [styles.imageContainer, style],
-			...wrapperProps,
-			ref: forwardedRef
-		}, /* @__PURE__ */ React.createElement(Image, {
-			...imageProps,
-			style: [styles.fallbackImage, { tintColor: resolvedTintColor }],
-			source: resolvedSource,
-			defaultSource,
-			onLoadStart,
-			onProgress: withProgress(onProgress),
-			onLoad: onLoadEnd ? (event) => {
-				const { width, height } = event.nativeEvent.source;
-				fallbackResult.current = {
-					ok: true,
-					width,
-					height
-				};
-				onLoad === null || onLoad === void 0 || onLoad(event);
-			} : onLoad,
-			onError: onLoadEnd ? (event) => {
-				fallbackResult.current = {
-					ok: false,
-					error: String(event.nativeEvent.error)
-				};
-				onError === null || onError === void 0 || onError(event);
-			} : onError,
-			onLoadEnd: onLoadEnd && (() => {
-				var _fallbackResult$curre;
-				return onLoadEnd((_fallbackResult$curre = fallbackResult.current) !== null && _fallbackResult$curre !== void 0 ? _fallbackResult$curre : {
-					ok: false,
-					error: "Failed to load the image"
-				});
-			}),
-			resizeMode: mode === "none" || mode === "scale-down" ? "center" : mode
-		}), children);
-	}
+	const fit = resolveObjectFit(objectFit, style);
+	const position = objectPositionOrCentered(objectPosition);
 	const sources = Array.isArray(source) ? source.length === 1 ? void 0 : source : void 0;
 	const single = Array.isArray(source) ? source[0] : source;
 	const resolvedSource = sources ? void 0 : Image.resolveAssetSource(single);
 	const resolvedDefaultSource = resolveDefaultSource(defaultSource);
-	return /* @__PURE__ */ React.createElement(View, {
-		style: [styles.imageContainer, style],
-		...wrapperProps,
-		ref: forwardedRef
-	}, /* @__PURE__ */ React.createElement(FastImageView, {
-		...imageProps,
-		tintColor: resolvedTintColor,
+	return /* @__PURE__ */ React.createElement(FastImageViewNativeComponent_default, {
+		...props,
+		ref: forwardedRef,
+		style: [styles.image, style],
+		recyclingKey: (_props$recyclingKey = props.recyclingKey) !== null && _props$recyclingKey !== void 0 ? _props$recyclingKey : void 0,
 		loopCount: loopCount(loop),
-		...transitionProps(transition),
-		style: StyleSheet.absoluteFill,
+		...resolveTransition(transition, (_defaultTransition = defaultTransition) !== null && _defaultTransition !== void 0 ? _defaultTransition : builtInTransition()),
 		source: resolvedSource,
 		sources,
 		defaultSource: resolvedDefaultSource,
 		onFastImageLoadStart: onLoadStart,
-		onFastImageProgress: withProgress(onProgress),
-		trackProgress: !!onProgress,
+		onFastImageProgress: onProgress,
+		handledEvents: handledEvents({
+			onLoadStart,
+			onProgress,
+			onLoad,
+			onError,
+			onLoadEnd
+		}),
 		onFastImageLoad: onLoad,
 		onFastImageError: onError,
 		onFastImageLoadEnd: onLoadEnd && ((event) => onLoadEnd(loadResult(event.nativeEvent))),
-		resizeMode: mode
-	}), children);
+		tintColor: resolvedTintColor,
+		objectFit: fit,
+		objectPositionX: position.x.fraction,
+		objectPositionXOffset: position.x.offset,
+		objectPositionY: position.y.fraction,
+		objectPositionYOffset: position.y.offset
+	});
 }
 const FastImageMemo = memo(FastImageBase);
 const FastImageComponent = forwardRef((props, ref) => /* @__PURE__ */ React.createElement(FastImageMemo, {
@@ -223,13 +343,21 @@ const noResult = {
 	ok: false,
 	error: "No result"
 };
+function nativeModule() {
+	if (!NativeFastImageModule_default) throw new Error("react-native-fast-image: the native module FastImageModule isn't in this app. Rebuild the app after installing the package (run pod install on iOS). It needs the New Architecture, and isn't in Expo Go: use a development build. In Jest, mock the function (e.g. jest.spyOn(FastImage, \"preload\")).");
+	return NativeFastImageModule_default;
+}
 const FastImage = FastImageComponent;
-FastImage.resizeMode = resizeMode;
 FastImage.cacheControl = cacheControl;
 FastImage.priority = priority;
+FastImage.resizeMode = resizeMode;
+FastImage.setDefaults = ({ transition } = {}) => {
+	if (transition === null) defaultTransition = void 0;
+	else if (transition !== void 0) defaultTransition = resolveTransition(transition, builtInTransition());
+};
 const ONE_SOURCE = "Takes one source, not an array of sizes: pass the size to use";
 const isSourceObject = (source) => typeof source === "object" && source !== null && !Array.isArray(source);
-FastImage.preload = (sources) => Promise.resolve(NativeModules.FastImageView.preload(sources.map((s) => isSourceObject(s) ? s : {}))).then((results) => sources.map((source, i) => {
+FastImage.preload = (sources) => Promise.resolve(nativeModule().preload(sources.map((s) => isSourceObject(s) ? s : {}))).then((results) => sources.map((source, i) => {
 	var _results$i;
 	if (Array.isArray(source)) return {
 		ok: false,
@@ -251,32 +379,31 @@ FastImage.preload = (sources) => Promise.resolve(NativeModules.FastImageView.pre
 		uri
 	};
 }));
-FastImage.clearMemoryCache = () => Promise.resolve(NativeModules.FastImageView.clearMemoryCache());
-FastImage.clearDiskCache = () => Promise.resolve(NativeModules.FastImageView.clearDiskCache());
-FastImage.configureCache = (limits = {}) => Promise.resolve(NativeModules.FastImageView.configureCache(limits));
+FastImage.clearMemoryCache = () => nativeModule().clearMemoryCache();
+FastImage.clearDiskCache = () => nativeModule().clearDiskCache();
+FastImage.configureCache = (limits) => {
+	const set = {};
+	const reset = [];
+	for (const [name, value] of Object.entries(limits !== null && limits !== void 0 ? limits : {})) if (value === null) reset.push(name);
+	else if (typeof value === "number") set[name] = value;
+	return nativeModule().configureCache({
+		...set,
+		reset
+	});
+};
 FastImage.writeToCache = (source, file) => Array.isArray(source) ? Promise.resolve({
 	ok: false,
 	error: ONE_SOURCE
-}) : Promise.resolve(NativeModules.FastImageView.writeToCache(isSourceObject(source) ? source : {}, file));
+}) : Promise.resolve(nativeModule().writeToCache(isSourceObject(source) ? source : {}, file));
 FastImage.getCachePath = (source) => Array.isArray(source) ? Promise.resolve({
 	ok: false,
 	error: ONE_SOURCE
-}) : Promise.resolve(NativeModules.FastImageView.getCachePath(isSourceObject(source) ? source : {}));
-const styles = StyleSheet.create({
-	fallbackImage: {
-		position: "absolute",
-		top: 0,
-		left: 0,
-		width: "100%",
-		height: "100%"
-	},
-	imageContainer: { overflow: "hidden" }
-});
+}) : Promise.resolve(nativeModule().getCachePath(isSourceObject(source) ? source : {}));
+const styles = StyleSheet.create({ image: { overflow: "hidden" } });
 /**
 * An image with content on top of it, like React Native's `ImageBackground`: a
-* view that the image fills, with the children on top. Use it rather than
-* giving `FastImage` children, which it won't render in the next major version
-* (the image will be a single native view). The other props go to the image;
+* view that the image fills, with the children on top (`FastImage` is a single
+* native view, which doesn't take children). The other props go to the image;
 * the ref is the view's.
 */
 const FastImageBackground = forwardRef(({ style, imageStyle, imageRef, children, importantForAccessibility, ...props }, ref) => /* @__PURE__ */ React.createElement(View, {
@@ -291,13 +418,5 @@ const FastImageBackground = forwardRef(({ style, imageStyle, imageRef, children,
 	ref: imageRef
 }), children));
 FastImageBackground.displayName = "FastImageBackground";
-const FastImageView = requireNativeComponent("FastImageView", FastImage, { nativeOnly: {
-	onFastImageLoadStart: true,
-	onFastImageProgress: true,
-	onFastImageLoad: true,
-	onFastImageError: true,
-	onFastImageLoadEnd: true,
-	trackProgress: true
-} });
 //#endregion
 export { FastImageBackground, FastImage as default };

package/dist/index.js.flow

@@ -1,25 +1,23 @@
 // @flow
 
-import type { ViewProps } from 'react-native/Libraries/Components/View/ViewPropTypes'
-import type { SyntheticEvent } from 'react-native/Libraries/Types/CoreEventTypes'
+import type { NativeSyntheticEvent, ViewProps } from 'react-native'
 
-export type OnLoadEvent = SyntheticEvent<
+export type OnLoadEvent = NativeSyntheticEvent<
     $ReadOnly<{
         width: number,
         height: number,
-        // The view's React tag. Missing on Android with the legacy architecture.
-        // TODO: make it required once the New Architecture is the minimum.
+        // The view's React tag (on iOS and Android; not on the web).
         target?: number,
     }>,
 >
 
-export type OnErrorEvent = SyntheticEvent<
+export type OnErrorEvent = NativeSyntheticEvent<
     $ReadOnly<{|
         error: string,
     |}>,
 >
 
-export type OnProgressEvent = SyntheticEvent<
+export type OnProgressEvent = NativeSyntheticEvent<
     $ReadOnly<{|
         loaded: number,
         total: number,
@@ -28,6 +26,12 @@ export type OnProgressEvent = SyntheticEvent<
     |}>,
 >
 
+export type Priority = $ReadOnly<{|
+    low: 'low',
+    normal: 'normal',
+    high: 'high',
+|}>
+
 export type ResizeMode = $ReadOnly<{|
     contain: 'contain',
     cover: 'cover',
@@ -36,20 +40,22 @@ export type ResizeMode = $ReadOnly<{|
     repeat: 'repeat',
 |}>
 
-export type Priority = $ReadOnly<{|
-    low: 'low',
-    normal: 'normal',
-    high: 'high',
-|}>
-
 export type CacheControl = $ReadOnly<{|
     immutable: 'immutable',
     web: 'web',
     cacheOnly: 'cacheOnly',
 |}>
 
-export type ResizeModes = $Values<ResizeMode>
 export type ObjectFit = 'fill' | 'contain' | 'cover' | 'none' | 'scale-down'
+export type PositionLength = number | string
+export type ObjectPosition =
+    | string
+    | $ReadOnly<{|
+          top?: PositionLength,
+          bottom?: PositionLength,
+          left?: PositionLength,
+          right?: PositionLength,
+      |}>
 export type Priorities = $Values<Priority>
 export type CacheControls = $Values<CacheControl>
 
@@ -82,6 +88,10 @@ export type Transition = $ReadOnly<{|
     skipOnCacheHit?: ?('none' | 'memory' | 'all'),
 |}>
 
+export type FastImageDefaults = $ReadOnly<{|
+    transition?: ?(boolean | number | Transition),
+|}>
+
 export type PreloadSuccess = {|
     uri: string,
     ok: true,
@@ -125,9 +135,7 @@ export type FastImageProps = $ReadOnly<{|
 
     tintColor?: number | string,
     objectFit?: ?ObjectFit,
-    // Deprecated: use objectFit.
-    resizeMode?: ?ResizeModes,
-    fallback?: ?boolean,
+    objectPosition?: ?ObjectPosition,
     recyclingKey?: ?string,
     loop?: ?(boolean | number),
     imageRendering?: ?('auto' | 'smooth' | 'pixelated'),
@@ -136,6 +144,9 @@ export type FastImageProps = $ReadOnly<{|
     downsample?: ?boolean,
     blurRadius?: ?number,
     testID?: ?string,
+    // FastImage is a single native view, which doesn't take children (since
+    // 10.0): use FastImageBackground.
+    children?: "FastImage doesn't take children: use FastImageBackground for content over an image",
 |}>
 
 export type FastImageBackgroundProps = $ReadOnly<{|
@@ -148,14 +159,19 @@ export type FastImageBackgroundProps = $ReadOnly<{|
 declare export var FastImageBackground: React$ComponentType<FastImageBackgroundProps>
 
 declare export default class FastImage extends React$Component<FastImageProps> {
+    // Deprecated: removed in 10.0, and a resizeMode prop is ignored; use
+    // objectFit. Kept so code that reads it doesn't throw.
     static resizeMode: ResizeMode;
+    // Deprecated: use the strings instead, e.g. priority: 'high'.
     static priority: Priority;
+    // Deprecated: use the strings instead, e.g. cache: 'immutable'.
     static cacheControl: CacheControl;
     static preload: PreloadFn;
     static clearMemoryCache: () => Promise<ClearCacheResult>;
     static clearDiskCache: () => Promise<ClearCacheResult>;
     static getCachePath: (source: FastImageSource) => Promise<CachePathResult>;
     static configureCache: (limits?: CacheLimits) => Promise<CacheState>;
+    static setDefaults: (defaults: FastImageDefaults) => void;
     static writeToCache: (
         source: FastImageSource,
         file: string,