From 0c39f4a6331413b8dfd44c1e482b73fc23125466 Mon Sep 17 00:00:00 2001 From: Abdalla Ayman Date: Thu, 26 Sep 2024 13:12:00 +0300 Subject: [PATCH] chore(build): Add build files to the repo --- .gitignore | 1 - dist/index.cjs.js | 144 +++++++++++++++++++++++++++++++++++++++ dist/index.cjs.js.flow | 75 ++++++++++++++++++++ dist/index.d.ts | 103 ++++++++++++++++++++++++++++ dist/index.d.ts.map | 1 + dist/index.js | 137 +++++++++++++++++++++++++++++++++++++ dist/index.js.flow | 75 ++++++++++++++++++++ dist/index.test.d.ts | 2 + dist/index.test.d.ts.map | 1 + 9 files changed, 538 insertions(+), 1 deletion(-) create mode 100644 dist/index.cjs.js create mode 100644 dist/index.cjs.js.flow create mode 100644 dist/index.d.ts create mode 100644 dist/index.d.ts.map create mode 100644 dist/index.js create mode 100644 dist/index.js.flow create mode 100644 dist/index.test.d.ts create mode 100644 dist/index.test.d.ts.map diff --git a/.gitignore b/.gitignore index 0c43f2cd0..fa3d20bbe 100644 --- a/.gitignore +++ b/.gitignore @@ -42,7 +42,6 @@ example/android/app/src/main/gen # build react-native-fast-image-*.tgz -dist/ # coverage reports coverage diff --git a/dist/index.cjs.js b/dist/index.cjs.js new file mode 100644 index 000000000..2df6a2976 --- /dev/null +++ b/dist/index.cjs.js @@ -0,0 +1,144 @@ +'use strict'; + +var _extends = require('@babel/runtime/helpers/extends'); +var React = require('react'); +var reactNative = require('react-native'); + +function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; } + +var _extends__default = /*#__PURE__*/_interopDefaultLegacy(_extends); +var React__default = /*#__PURE__*/_interopDefaultLegacy(React); + +const resizeMode = { + contain: 'contain', + cover: 'cover', + stretch: 'stretch', + center: 'center' +}; +const priority = { + low: 'low', + normal: 'normal', + high: 'high' +}; +const cacheControl = { + // Ignore headers, use uri as cache key, fetch only if not in cache. + immutable: 'immutable', + // Respect http headers, no aggressive caching. + web: 'web', + // Only load from cache. + cacheOnly: 'cacheOnly' +}; + +const resolveDefaultSource = defaultSource => { + if (!defaultSource) { + return null; + } + + if (reactNative.Platform.OS === 'android') { + // Android receives a URI string, and resolves into a Drawable using RN's methods. + const resolved = reactNative.Image.resolveAssetSource(defaultSource); + + if (resolved) { + return resolved.uri; + } + + return null; + } // iOS or other number mapped assets + // In iOS the number is passed, and bridged automatically into a UIImage + + + return defaultSource; +}; + +function FastImageBase({ + source, + defaultSource, + tintColor, + onLoadStart, + onProgress, + onLoad, + onError, + onLoadEnd, + style, + fallback, + children, + // eslint-disable-next-line no-shadow + resizeMode = 'cover', + forwardedRef, + ...props +}) { + if (fallback) { + const cleanedSource = { ...source + }; + delete cleanedSource.cache; + const resolvedSource = reactNative.Image.resolveAssetSource(cleanedSource); + return /*#__PURE__*/React__default['default'].createElement(reactNative.View, { + style: [styles.imageContainer, style], + ref: forwardedRef + }, /*#__PURE__*/React__default['default'].createElement(reactNative.Image, _extends__default['default']({}, props, { + style: [reactNative.StyleSheet.absoluteFill, { + tintColor + }], + source: resolvedSource, + defaultSource: defaultSource, + onLoadStart: onLoadStart, + onProgress: onProgress, + onLoad: onLoad, + onError: onError, + onLoadEnd: onLoadEnd, + resizeMode: resizeMode + })), children); + } + + const resolvedSource = reactNative.Image.resolveAssetSource(source); + const resolvedDefaultSource = resolveDefaultSource(defaultSource); + return /*#__PURE__*/React__default['default'].createElement(reactNative.View, { + style: [styles.imageContainer, style], + ref: forwardedRef + }, /*#__PURE__*/React__default['default'].createElement(FastImageView, _extends__default['default']({}, props, { + tintColor: tintColor, + style: reactNative.StyleSheet.absoluteFill, + source: resolvedSource, + defaultSource: resolvedDefaultSource, + onFastImageLoadStart: onLoadStart, + onFastImageProgress: onProgress, + onFastImageLoad: onLoad, + onFastImageError: onError, + onFastImageLoadEnd: onLoadEnd, + resizeMode: resizeMode + })), children); +} + +const FastImageMemo = /*#__PURE__*/React.memo(FastImageBase); +const FastImageComponent = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React__default['default'].createElement(FastImageMemo, _extends__default['default']({ + forwardedRef: ref +}, props))); +FastImageComponent.displayName = 'FastImage'; +const FastImage = FastImageComponent; +FastImage.resizeMode = resizeMode; +FastImage.cacheControl = cacheControl; +FastImage.priority = priority; + +FastImage.preload = sources => reactNative.NativeModules.FastImageView.preload(sources); + +FastImage.clearMemoryCache = () => reactNative.NativeModules.FastImageView.clearMemoryCache(); + +FastImage.clearDiskCache = () => reactNative.NativeModules.FastImageView.clearDiskCache(); + +const styles = reactNative.StyleSheet.create({ + imageContainer: { + overflow: 'hidden' + } +}); // Types of requireNativeComponent are not correct. + +const FastImageView = reactNative.requireNativeComponent('FastImageView', FastImage, { + nativeOnly: { + onFastImageLoadStart: true, + onFastImageProgress: true, + onFastImageLoad: true, + onFastImageError: true, + onFastImageLoadEnd: true + } +}); + +module.exports = FastImage; diff --git a/dist/index.cjs.js.flow b/dist/index.cjs.js.flow new file mode 100644 index 000000000..8124c868a --- /dev/null +++ b/dist/index.cjs.js.flow @@ -0,0 +1,75 @@ +// @flow + +import type { ViewProps } from 'react-native/Libraries/Components/View/ViewPropTypes' +import type { SyntheticEvent } from 'react-native/Libraries/Types/CoreEventTypes' + +export type OnLoadEvent = SyntheticEvent< + $ReadOnly<{ + width: number, + height: number, + }>, +> + +export type OnProgressEvent = SyntheticEvent< + $ReadOnly<{| + loaded: number, + total: number, + |}>, +> + +export type ResizeMode = $ReadOnly<{| + contain: 'contain', + cover: 'cover', + stretch: 'stretch', + center: 'center', +|}> + +export type Priority = $ReadOnly<{| + low: 'low', + normal: 'normal', + high: 'high', +|}> + +export type CacheControl = $ReadOnly<{| + immutable: 'immutable', + web: 'web', + cacheOnly: 'cacheOnly', +|}> + +export type ResizeModes = $Values +export type Priorities = $Values +export type CacheControls = $Values + +export type PreloadFn = (sources: Array) => void +export type FastImageSource = { + uri?: string, + headers?: Object, + priority?: Priorities, + cache?: CacheControls, +} + +export type FastImageProps = $ReadOnly<{| + ...ViewProps, + onError?: ?() => void, + onLoad?: ?(event: OnLoadEvent) => void, + onLoadEnd?: ?() => void, + onLoadStart?: ?() => void, + onProgress?: ?(event: OnProgressEvent) => void, + + source?: ?(FastImageSource | number), + defaultSource?: ?number, + + tintColor?: number | string, + resizeMode?: ?ResizeModes, + fallback?: ?boolean, + testID?: ?string, +|}> + +declare export default class FastImage extends React$Component { + static resizeMode: ResizeMode; + static priority: Priority; + static cacheControl: CacheControl; + static preload: PreloadFn; + static clearMemoryCache: () => Promise; + static clearDiskCache: () => Promise; +} diff --git a/dist/index.d.ts b/dist/index.d.ts new file mode 100644 index 000000000..5abb7c98b --- /dev/null +++ b/dist/index.d.ts @@ -0,0 +1,103 @@ +import React from 'react'; +import { FlexStyle, LayoutChangeEvent, ShadowStyleIOS, StyleProp, TransformsStyle, ImageRequireSource, AccessibilityProps, ViewProps, ColorValue } from 'react-native'; +export declare type ResizeMode = 'contain' | 'cover' | 'stretch' | 'center'; +declare const resizeMode: { + readonly contain: "contain"; + readonly cover: "cover"; + readonly stretch: "stretch"; + readonly center: "center"; +}; +export declare type Priority = 'low' | 'normal' | 'high'; +declare const priority: { + readonly low: "low"; + readonly normal: "normal"; + readonly high: "high"; +}; +declare type Cache = 'immutable' | 'web' | 'cacheOnly'; +declare const cacheControl: { + readonly immutable: "immutable"; + readonly web: "web"; + readonly cacheOnly: "cacheOnly"; +}; +export declare type Source = { + uri?: string; + headers?: { + [key: string]: string; + }; + priority?: Priority; + cache?: Cache; +}; +export interface OnLoadEvent { + nativeEvent: { + width: number; + height: number; + }; +} +export interface OnProgressEvent { + nativeEvent: { + loaded: number; + total: number; + }; +} +export interface ImageStyle extends FlexStyle, TransformsStyle, ShadowStyleIOS { + backfaceVisibility?: 'visible' | 'hidden'; + borderBottomLeftRadius?: number; + borderBottomRightRadius?: number; + backgroundColor?: string; + borderColor?: string; + borderWidth?: number; + borderRadius?: number; + borderTopLeftRadius?: number; + borderTopRightRadius?: number; + overlayColor?: string; + opacity?: number; +} +export interface FastImageProps extends AccessibilityProps, ViewProps { + source?: Source | ImageRequireSource; + defaultSource?: ImageRequireSource; + resizeMode?: ResizeMode; + fallback?: boolean; + onLoadStart?(): void; + onProgress?(event: OnProgressEvent): void; + onLoad?(event: OnLoadEvent): void; + onError?(): void; + onLoadEnd?(): void; + /** + * onLayout function + * + * Invoked on mount and layout changes with + * + * {nativeEvent: { layout: {x, y, width, height}}}. + */ + onLayout?: (event: LayoutChangeEvent) => void; + /** + * + * Style + */ + style?: StyleProp; + /** + * TintColor + * + * If supplied, changes the color of all the non-transparent pixels to the given color. + */ + tintColor?: ColorValue; + /** + * A unique identifier for this element to be used in UI Automation testing scripts. + */ + testID?: string; + /** + * Render children within the image. + */ + children?: React.ReactNode; +} +export interface FastImageStaticProperties { + resizeMode: typeof resizeMode; + priority: typeof priority; + cacheControl: typeof cacheControl; + preload: (sources: Source[]) => void; + clearMemoryCache: () => Promise; + clearDiskCache: () => Promise; +} +declare const FastImage: React.ComponentType & FastImageStaticProperties; +export default FastImage; +//# sourceMappingURL=index.d.ts.map \ No newline at end of file diff --git a/dist/index.d.ts.map b/dist/index.d.ts.map new file mode 100644 index 000000000..ba43a244c --- /dev/null +++ b/dist/index.d.ts.map @@ -0,0 +1 @@ +{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":"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"} \ No newline at end of file diff --git a/dist/index.js b/dist/index.js new file mode 100644 index 000000000..58e0308bd --- /dev/null +++ b/dist/index.js @@ -0,0 +1,137 @@ +import _extends from '@babel/runtime/helpers/extends'; +import React, { forwardRef, memo } from 'react'; +import { NativeModules, StyleSheet, requireNativeComponent, Image, View, Platform } from 'react-native'; + +const resizeMode = { + contain: 'contain', + cover: 'cover', + stretch: 'stretch', + center: 'center' +}; +const priority = { + low: 'low', + normal: 'normal', + high: 'high' +}; +const cacheControl = { + // Ignore headers, use uri as cache key, fetch only if not in cache. + immutable: 'immutable', + // Respect http headers, no aggressive caching. + web: 'web', + // Only load from cache. + cacheOnly: 'cacheOnly' +}; + +const resolveDefaultSource = defaultSource => { + if (!defaultSource) { + return null; + } + + if (Platform.OS === 'android') { + // Android receives a URI string, and resolves into a Drawable using RN's methods. + const resolved = Image.resolveAssetSource(defaultSource); + + if (resolved) { + return resolved.uri; + } + + return null; + } // iOS or other number mapped assets + // In iOS the number is passed, and bridged automatically into a UIImage + + + return defaultSource; +}; + +function FastImageBase({ + source, + defaultSource, + tintColor, + onLoadStart, + onProgress, + onLoad, + onError, + onLoadEnd, + style, + fallback, + children, + // eslint-disable-next-line no-shadow + resizeMode = 'cover', + forwardedRef, + ...props +}) { + if (fallback) { + const cleanedSource = { ...source + }; + delete cleanedSource.cache; + const resolvedSource = Image.resolveAssetSource(cleanedSource); + return /*#__PURE__*/React.createElement(View, { + style: [styles.imageContainer, style], + ref: forwardedRef + }, /*#__PURE__*/React.createElement(Image, _extends({}, props, { + style: [StyleSheet.absoluteFill, { + tintColor + }], + source: resolvedSource, + defaultSource: defaultSource, + onLoadStart: onLoadStart, + onProgress: onProgress, + onLoad: onLoad, + onError: onError, + onLoadEnd: onLoadEnd, + resizeMode: resizeMode + })), children); + } + + const resolvedSource = Image.resolveAssetSource(source); + const resolvedDefaultSource = resolveDefaultSource(defaultSource); + return /*#__PURE__*/React.createElement(View, { + style: [styles.imageContainer, style], + ref: forwardedRef + }, /*#__PURE__*/React.createElement(FastImageView, _extends({}, props, { + tintColor: tintColor, + style: StyleSheet.absoluteFill, + source: resolvedSource, + defaultSource: resolvedDefaultSource, + onFastImageLoadStart: onLoadStart, + onFastImageProgress: onProgress, + onFastImageLoad: onLoad, + onFastImageError: onError, + onFastImageLoadEnd: onLoadEnd, + resizeMode: resizeMode + })), children); +} + +const FastImageMemo = /*#__PURE__*/memo(FastImageBase); +const FastImageComponent = /*#__PURE__*/forwardRef((props, ref) => /*#__PURE__*/React.createElement(FastImageMemo, _extends({ + forwardedRef: ref +}, props))); +FastImageComponent.displayName = 'FastImage'; +const FastImage = FastImageComponent; +FastImage.resizeMode = resizeMode; +FastImage.cacheControl = cacheControl; +FastImage.priority = priority; + +FastImage.preload = sources => NativeModules.FastImageView.preload(sources); + +FastImage.clearMemoryCache = () => NativeModules.FastImageView.clearMemoryCache(); + +FastImage.clearDiskCache = () => NativeModules.FastImageView.clearDiskCache(); + +const styles = StyleSheet.create({ + imageContainer: { + overflow: 'hidden' + } +}); // Types of requireNativeComponent are not correct. + +const FastImageView = requireNativeComponent('FastImageView', FastImage, { + nativeOnly: { + onFastImageLoadStart: true, + onFastImageProgress: true, + onFastImageLoad: true, + onFastImageError: true, + onFastImageLoadEnd: true + } +}); + +export default FastImage; diff --git a/dist/index.js.flow b/dist/index.js.flow new file mode 100644 index 000000000..8124c868a --- /dev/null +++ b/dist/index.js.flow @@ -0,0 +1,75 @@ +// @flow + +import type { ViewProps } from 'react-native/Libraries/Components/View/ViewPropTypes' +import type { SyntheticEvent } from 'react-native/Libraries/Types/CoreEventTypes' + +export type OnLoadEvent = SyntheticEvent< + $ReadOnly<{ + width: number, + height: number, + }>, +> + +export type OnProgressEvent = SyntheticEvent< + $ReadOnly<{| + loaded: number, + total: number, + |}>, +> + +export type ResizeMode = $ReadOnly<{| + contain: 'contain', + cover: 'cover', + stretch: 'stretch', + center: 'center', +|}> + +export type Priority = $ReadOnly<{| + low: 'low', + normal: 'normal', + high: 'high', +|}> + +export type CacheControl = $ReadOnly<{| + immutable: 'immutable', + web: 'web', + cacheOnly: 'cacheOnly', +|}> + +export type ResizeModes = $Values +export type Priorities = $Values +export type CacheControls = $Values + +export type PreloadFn = (sources: Array) => void +export type FastImageSource = { + uri?: string, + headers?: Object, + priority?: Priorities, + cache?: CacheControls, +} + +export type FastImageProps = $ReadOnly<{| + ...ViewProps, + onError?: ?() => void, + onLoad?: ?(event: OnLoadEvent) => void, + onLoadEnd?: ?() => void, + onLoadStart?: ?() => void, + onProgress?: ?(event: OnProgressEvent) => void, + + source?: ?(FastImageSource | number), + defaultSource?: ?number, + + tintColor?: number | string, + resizeMode?: ?ResizeModes, + fallback?: ?boolean, + testID?: ?string, +|}> + +declare export default class FastImage extends React$Component { + static resizeMode: ResizeMode; + static priority: Priority; + static cacheControl: CacheControl; + static preload: PreloadFn; + static clearMemoryCache: () => Promise; + static clearDiskCache: () => Promise; +} diff --git a/dist/index.test.d.ts b/dist/index.test.d.ts new file mode 100644 index 000000000..121d59b38 --- /dev/null +++ b/dist/index.test.d.ts @@ -0,0 +1,2 @@ +export {}; +//# sourceMappingURL=index.test.d.ts.map \ No newline at end of file diff --git a/dist/index.test.d.ts.map b/dist/index.test.d.ts.map new file mode 100644 index 000000000..e451024d1 --- /dev/null +++ b/dist/index.test.d.ts.map @@ -0,0 +1 @@ +{"version":3,"file":"index.test.d.ts","sourceRoot":"","sources":["../src/index.test.tsx"],"names":[],"mappings":""} \ No newline at end of file