chore: Convert example to TypeScript (#648)

This commit is contained in:
Dylan Vann 2020-03-12 02:27:37 -04:00 committed by GitHub
parent dc3d66e1a0
commit bf55742e5f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
40 changed files with 672 additions and 644 deletions

View File

@ -1,6 +1,8 @@
module.exports = {
root: true,
extends: '@react-native-community',
parser: '@typescript-eslint/parser',
plugins: ['@typescript-eslint'],
rules: {
semi: ['error', 'never'],
},

View File

@ -1,75 +0,0 @@
[ignore]
; We fork some components by platform
.*/*[.]android.js
; Ignore "BUCK" generated dirs
<PROJECT_ROOT>/\.buckd/
; Ignore polyfills
node_modules/react-native/Libraries/polyfills/.*
; These should not be required directly
; require from fbjs/lib instead: require('fbjs/lib/warning')
node_modules/warning/.*
; Flow doesn't support platforms
.*/Libraries/Utilities/LoadingView.js
[untyped]
.*/node_modules/@react-native-community/cli/.*/.*
[include]
[libs]
node_modules/react-native/Libraries/react-native/react-native-interface.js
node_modules/react-native/flow/
[options]
emoji=true
esproposal.optional_chaining=enable
esproposal.nullish_coalescing=enable
module.file_ext=.js
module.file_ext=.json
module.file_ext=.ios.js
munge_underscores=true
module.name_mapper='^react-native$' -> '<PROJECT_ROOT>/node_modules/react-native/Libraries/react-native/react-native-implementation'
module.name_mapper='^react-native/\(.*\)$' -> '<PROJECT_ROOT>/node_modules/react-native/\1'
module.name_mapper='^[./a-zA-Z0-9$_-]+\.\(bmp\|gif\|jpg\|jpeg\|png\|psd\|svg\|webp\|m4v\|mov\|mp4\|mpeg\|mpg\|webm\|aac\|aiff\|caf\|m4a\|mp3\|wav\|html\|pdf\)$' -> '<PROJECT_ROOT>/node_modules/react-native/Libraries/Image/RelativeImageStub'
suppress_type=$FlowIssue
suppress_type=$FlowFixMe
suppress_type=$FlowFixMeProps
suppress_type=$FlowFixMeState
suppress_comment=\\(.\\|\n\\)*\\$FlowFixMe\\($\\|[^(]\\|(\\(<VERSION>\\)? *\\(site=[a-z,_]*react_native\\(_ios\\)?_\\(oss\\|fb\\)[a-z,_]*\\)?)\\)
suppress_comment=\\(.\\|\n\\)*\\$FlowIssue\\((\\(<VERSION>\\)? *\\(site=[a-z,_]*react_native\\(_ios\\)?_\\(oss\\|fb\\)[a-z,_]*\\)?)\\)?:? #[0-9]+
suppress_comment=\\(.\\|\n\\)*\\$FlowExpectedError
[lints]
sketchy-null-number=warn
sketchy-null-mixed=warn
sketchy-number=warn
untyped-type-import=warn
nonstrict-import=warn
deprecated-type=warn
unsafe-getters-setters=warn
inexact-spread=warn
unnecessary-invariant=warn
signature-verification-failure=warn
deprecated-utility=error
[strict]
deprecated-type
nonstrict-import
sketchy-null
unclear-type
unsafe-getters-setters
untyped-import
untyped-type-import
[version]
^0.105.0

5
ReactNativeFastImageExample/.gitignore vendored Normal file → Executable file
View File

@ -20,6 +20,7 @@ DerivedData
*.hmap
*.ipa
*.xcuserstate
project.xcworkspace
# Android/IntelliJ
#
@ -29,6 +30,10 @@ build/
local.properties
*.iml
# Visual Studio Code
#
.vscode/
# node.js
#
node_modules/

View File

@ -1,14 +0,0 @@
/**
* @format
*/
import 'react-native'
import React from 'react'
import App from '../App'
// Note: test renderer must be required after react-native.
import renderer from 'react-test-renderer'
it('renders correctly', () => {
renderer.create(<App />)
})

View File

@ -0,0 +1,9 @@
/**
* @format
*/
export const _ = 0
it('adds', () => {
expect(2 + 2).toBe(4)
})

0
ReactNativeFastImageExample/android/app/_BUCK Normal file → Executable file
View File

0
ReactNativeFastImageExample/android/app/build.gradle Normal file → Executable file
View File

View File

0
ReactNativeFastImageExample/android/settings.gradle Normal file → Executable file
View File

View File

@ -230,9 +230,9 @@ PODS:
- React-cxxreact (= 0.61.5)
- React-jsi (= 0.61.5)
- ReactCommon/jscallinvoker (= 0.61.5)
- RNCMaskedView (0.1.6):
- RNCMaskedView (0.1.7):
- React
- RNFastImage (7.0.2):
- RNFastImage (8.0.0):
- React
- SDWebImage (~> 5.0)
- SDWebImageWebPCoder (~> 0.2.3)
@ -240,7 +240,7 @@ PODS:
- React
- RNReanimated (1.7.0):
- React
- RNScreens (2.2.0):
- RNScreens (2.3.0):
- React
- RNVectorIcons (6.6.0):
- React
@ -394,11 +394,11 @@ SPEC CHECKSUMS:
React-RCTText: 9ccc88273e9a3aacff5094d2175a605efa854dbe
React-RCTVibration: a49a1f42bf8f5acf1c3e297097517c6b3af377ad
ReactCommon: 198c7c8d3591f975e5431bec1b0b3b581aa1c5dd
RNCMaskedView: a88953beefbd347a29072d9eba90e42945fe291e
RNFastImage: 9b0c22643872bb7494c8d87bbbb66cc4c0d9e7a2
RNCMaskedView: 76c40a1d41c3e2535df09246a2b5487f04de0814
RNFastImage: c104f15f04c4f68bd65c9645cc27900bbacd9cc7
RNGestureHandler: dde546180bf24af0b5f737c8ad04b6f3fa51609a
RNReanimated: 031fe8d9ea93c2bd689a40f05320ef9d96f74d7f
RNScreens: 812b79d384e2bea7eebc4ec981469160d4948fd5
RNScreens: 03bf608b92ac0acf323f47d8f5b63a8f829340c8
RNVectorIcons: 0bb4def82230be1333ddaeee9fcba45f0b288ed4
SDWebImage: 4d5c027c935438f341ed33dbac53ff9f479922ca
SDWebImageWebPCoder: 947093edd1349d820c40afbd9f42acb6cdecd987

View File

@ -12,14 +12,14 @@
13B07FBD1A68108700A75B9A /* LaunchScreen.xib in Resources */ = {isa = PBXBuildFile; fileRef = 13B07FB11A68108700A75B9A /* LaunchScreen.xib */; };
13B07FBF1A68108700A75B9A /* Images.xcassets in Resources */ = {isa = PBXBuildFile; fileRef = 13B07FB51A68108700A75B9A /* Images.xcassets */; };
13B07FC11A68108700A75B9A /* main.m in Sources */ = {isa = PBXBuildFile; fileRef = 13B07FB71A68108700A75B9A /* main.m */; };
1829EFD01EDCC120B36DC384 /* libPods-ReactNativeFastImageExampleTests.a in Frameworks */ = {isa = PBXBuildFile; fileRef = BA5F569BE99A43AAF170C1B2 /* libPods-ReactNativeFastImageExampleTests.a */; };
2D02E4BC1E0B4A80006451C7 /* AppDelegate.m in Sources */ = {isa = PBXBuildFile; fileRef = 13B07FB01A68108700A75B9A /* AppDelegate.m */; };
2D02E4BD1E0B4A84006451C7 /* Images.xcassets in Resources */ = {isa = PBXBuildFile; fileRef = 13B07FB51A68108700A75B9A /* Images.xcassets */; };
2D02E4BF1E0B4AB3006451C7 /* main.m in Sources */ = {isa = PBXBuildFile; fileRef = 13B07FB71A68108700A75B9A /* main.m */; };
2DCD954D1E0B4F2C00145EB5 /* ReactNativeFastImageExampleTests.m in Sources */ = {isa = PBXBuildFile; fileRef = 00E356F21AD99517003FC87E /* ReactNativeFastImageExampleTests.m */; };
5B76F0ED936BBFCBF369D233 /* libPods-ReactNativeFastImageExample-tvOSTests.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 9B7B0D2E9145E48BDA2976AA /* libPods-ReactNativeFastImageExample-tvOSTests.a */; };
8ED0B79327FA1A4B3B6281B4 /* libPods-ReactNativeFastImageExample-tvOS.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 686792D106A578EEBD13F1AF /* libPods-ReactNativeFastImageExample-tvOS.a */; };
F8C69D5180CB05D63857155A /* libPods-ReactNativeFastImageExample.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 80915DCF4D7BA073041627FB /* libPods-ReactNativeFastImageExample.a */; };
7339F561B0CE29B728993582 /* libPods-ReactNativeFastImageExampleTests.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 5730E398098D985EEA94844D /* libPods-ReactNativeFastImageExampleTests.a */; };
7BF37A49DF3174DEBBCD15AF /* libPods-ReactNativeFastImageExample.a in Frameworks */ = {isa = PBXBuildFile; fileRef = B3FA6DA7AADBA70EE7027384 /* libPods-ReactNativeFastImageExample.a */; };
B589F39E663EF2DC2BE53734 /* libPods-ReactNativeFastImageExample-tvOSTests.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 36F2D8488D887812E71A27EF /* libPods-ReactNativeFastImageExample-tvOSTests.a */; };
DCA1D63D4747298994E20087 /* libPods-ReactNativeFastImageExample-tvOS.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 0D14914D6626685F198EBC65 /* libPods-ReactNativeFastImageExample-tvOS.a */; };
/* End PBXBuildFile section */
/* Begin PBXContainerItemProxy section */
@ -44,7 +44,7 @@
00E356EE1AD99517003FC87E /* ReactNativeFastImageExampleTests.xctest */ = {isa = PBXFileReference; explicitFileType = wrapper.cfbundle; includeInIndex = 0; path = ReactNativeFastImageExampleTests.xctest; sourceTree = BUILT_PRODUCTS_DIR; };
00E356F11AD99517003FC87E /* Info.plist */ = {isa = PBXFileReference; lastKnownFileType = text.plist.xml; path = Info.plist; sourceTree = "<group>"; };
00E356F21AD99517003FC87E /* ReactNativeFastImageExampleTests.m */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.objc; path = ReactNativeFastImageExampleTests.m; sourceTree = "<group>"; };
0EA7E3956412991EA7A2CA0C /* Pods-ReactNativeFastImageExampleTests.release.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-ReactNativeFastImageExampleTests.release.xcconfig"; path = "Target Support Files/Pods-ReactNativeFastImageExampleTests/Pods-ReactNativeFastImageExampleTests.release.xcconfig"; sourceTree = "<group>"; };
0D14914D6626685F198EBC65 /* libPods-ReactNativeFastImageExample-tvOS.a */ = {isa = PBXFileReference; explicitFileType = archive.ar; includeInIndex = 0; path = "libPods-ReactNativeFastImageExample-tvOS.a"; sourceTree = BUILT_PRODUCTS_DIR; };
13B07F961A680F5B00A75B9A /* ReactNativeFastImageExample.app */ = {isa = PBXFileReference; explicitFileType = wrapper.application; includeInIndex = 0; path = ReactNativeFastImageExample.app; sourceTree = BUILT_PRODUCTS_DIR; };
13B07FAF1A68108700A75B9A /* AppDelegate.h */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.h; name = AppDelegate.h; path = ReactNativeFastImageExample/AppDelegate.h; sourceTree = "<group>"; };
13B07FB01A68108700A75B9A /* AppDelegate.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; name = AppDelegate.m; path = ReactNativeFastImageExample/AppDelegate.m; sourceTree = "<group>"; };
@ -52,21 +52,21 @@
13B07FB51A68108700A75B9A /* Images.xcassets */ = {isa = PBXFileReference; lastKnownFileType = folder.assetcatalog; name = Images.xcassets; path = ReactNativeFastImageExample/Images.xcassets; sourceTree = "<group>"; };
13B07FB61A68108700A75B9A /* Info.plist */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.plist.xml; name = Info.plist; path = ReactNativeFastImageExample/Info.plist; sourceTree = "<group>"; };
13B07FB71A68108700A75B9A /* main.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; name = main.m; path = ReactNativeFastImageExample/main.m; sourceTree = "<group>"; };
160E9822226B7DA14DDC0D14 /* Pods-ReactNativeFastImageExampleTests.debug.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-ReactNativeFastImageExampleTests.debug.xcconfig"; path = "Target Support Files/Pods-ReactNativeFastImageExampleTests/Pods-ReactNativeFastImageExampleTests.debug.xcconfig"; sourceTree = "<group>"; };
2D02E47B1E0B4A5D006451C7 /* ReactNativeFastImageExample-tvOS.app */ = {isa = PBXFileReference; explicitFileType = wrapper.application; includeInIndex = 0; path = "ReactNativeFastImageExample-tvOS.app"; sourceTree = BUILT_PRODUCTS_DIR; };
2D02E4901E0B4A5D006451C7 /* ReactNativeFastImageExample-tvOSTests.xctest */ = {isa = PBXFileReference; explicitFileType = wrapper.cfbundle; includeInIndex = 0; path = "ReactNativeFastImageExample-tvOSTests.xctest"; sourceTree = BUILT_PRODUCTS_DIR; };
409CCB29044E2AF2ED6DF4BA /* Pods-ReactNativeFastImageExample.debug.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-ReactNativeFastImageExample.debug.xcconfig"; path = "Target Support Files/Pods-ReactNativeFastImageExample/Pods-ReactNativeFastImageExample.debug.xcconfig"; sourceTree = "<group>"; };
686792D106A578EEBD13F1AF /* libPods-ReactNativeFastImageExample-tvOS.a */ = {isa = PBXFileReference; explicitFileType = archive.ar; includeInIndex = 0; path = "libPods-ReactNativeFastImageExample-tvOS.a"; sourceTree = BUILT_PRODUCTS_DIR; };
73097A8CB6376953A4C77750 /* Pods-ReactNativeFastImageExample-tvOSTests.debug.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-ReactNativeFastImageExample-tvOSTests.debug.xcconfig"; path = "Target Support Files/Pods-ReactNativeFastImageExample-tvOSTests/Pods-ReactNativeFastImageExample-tvOSTests.debug.xcconfig"; sourceTree = "<group>"; };
80915DCF4D7BA073041627FB /* libPods-ReactNativeFastImageExample.a */ = {isa = PBXFileReference; explicitFileType = archive.ar; includeInIndex = 0; path = "libPods-ReactNativeFastImageExample.a"; sourceTree = BUILT_PRODUCTS_DIR; };
9B7B0D2E9145E48BDA2976AA /* libPods-ReactNativeFastImageExample-tvOSTests.a */ = {isa = PBXFileReference; explicitFileType = archive.ar; includeInIndex = 0; path = "libPods-ReactNativeFastImageExample-tvOSTests.a"; sourceTree = BUILT_PRODUCTS_DIR; };
A14530762FEF5633D3AEC4A8 /* Pods-ReactNativeFastImageExample-tvOS.debug.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-ReactNativeFastImageExample-tvOS.debug.xcconfig"; path = "Target Support Files/Pods-ReactNativeFastImageExample-tvOS/Pods-ReactNativeFastImageExample-tvOS.debug.xcconfig"; sourceTree = "<group>"; };
AB6AC85AF5F7B0ACC2A0C2F9 /* Pods-ReactNativeFastImageExample.release.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-ReactNativeFastImageExample.release.xcconfig"; path = "Target Support Files/Pods-ReactNativeFastImageExample/Pods-ReactNativeFastImageExample.release.xcconfig"; sourceTree = "<group>"; };
B2ADAAD9246EF7C6F31DB94D /* Pods-ReactNativeFastImageExample-tvOS.release.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-ReactNativeFastImageExample-tvOS.release.xcconfig"; path = "Target Support Files/Pods-ReactNativeFastImageExample-tvOS/Pods-ReactNativeFastImageExample-tvOS.release.xcconfig"; sourceTree = "<group>"; };
BA5F569BE99A43AAF170C1B2 /* libPods-ReactNativeFastImageExampleTests.a */ = {isa = PBXFileReference; explicitFileType = archive.ar; includeInIndex = 0; path = "libPods-ReactNativeFastImageExampleTests.a"; sourceTree = BUILT_PRODUCTS_DIR; };
36F2D8488D887812E71A27EF /* libPods-ReactNativeFastImageExample-tvOSTests.a */ = {isa = PBXFileReference; explicitFileType = archive.ar; includeInIndex = 0; path = "libPods-ReactNativeFastImageExample-tvOSTests.a"; sourceTree = BUILT_PRODUCTS_DIR; };
4BC30000AD6A26886DBE1546 /* Pods-ReactNativeFastImageExample-tvOSTests.release.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-ReactNativeFastImageExample-tvOSTests.release.xcconfig"; path = "Target Support Files/Pods-ReactNativeFastImageExample-tvOSTests/Pods-ReactNativeFastImageExample-tvOSTests.release.xcconfig"; sourceTree = "<group>"; };
4F945D662771617B29FCC251 /* Pods-ReactNativeFastImageExample.release.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-ReactNativeFastImageExample.release.xcconfig"; path = "Target Support Files/Pods-ReactNativeFastImageExample/Pods-ReactNativeFastImageExample.release.xcconfig"; sourceTree = "<group>"; };
5730E398098D985EEA94844D /* libPods-ReactNativeFastImageExampleTests.a */ = {isa = PBXFileReference; explicitFileType = archive.ar; includeInIndex = 0; path = "libPods-ReactNativeFastImageExampleTests.a"; sourceTree = BUILT_PRODUCTS_DIR; };
5C5A3370DB6FCFF06A10F2A5 /* Pods-ReactNativeFastImageExampleTests.debug.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-ReactNativeFastImageExampleTests.debug.xcconfig"; path = "Target Support Files/Pods-ReactNativeFastImageExampleTests/Pods-ReactNativeFastImageExampleTests.debug.xcconfig"; sourceTree = "<group>"; };
8E2A7D7E62E9083CAA8F5E5A /* Pods-ReactNativeFastImageExample.debug.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-ReactNativeFastImageExample.debug.xcconfig"; path = "Target Support Files/Pods-ReactNativeFastImageExample/Pods-ReactNativeFastImageExample.debug.xcconfig"; sourceTree = "<group>"; };
90A992153999BEDA2888B03A /* Pods-ReactNativeFastImageExample-tvOS.debug.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-ReactNativeFastImageExample-tvOS.debug.xcconfig"; path = "Target Support Files/Pods-ReactNativeFastImageExample-tvOS/Pods-ReactNativeFastImageExample-tvOS.debug.xcconfig"; sourceTree = "<group>"; };
B3FA6DA7AADBA70EE7027384 /* libPods-ReactNativeFastImageExample.a */ = {isa = PBXFileReference; explicitFileType = archive.ar; includeInIndex = 0; path = "libPods-ReactNativeFastImageExample.a"; sourceTree = BUILT_PRODUCTS_DIR; };
BDAC40DD72EAA22375172E5A /* Pods-ReactNativeFastImageExample-tvOS.release.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-ReactNativeFastImageExample-tvOS.release.xcconfig"; path = "Target Support Files/Pods-ReactNativeFastImageExample-tvOS/Pods-ReactNativeFastImageExample-tvOS.release.xcconfig"; sourceTree = "<group>"; };
E38D7B34F535ED1EECB9B3FF /* Pods-ReactNativeFastImageExampleTests.release.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-ReactNativeFastImageExampleTests.release.xcconfig"; path = "Target Support Files/Pods-ReactNativeFastImageExampleTests/Pods-ReactNativeFastImageExampleTests.release.xcconfig"; sourceTree = "<group>"; };
E4E0AD4EA9AF278B80494501 /* Pods-ReactNativeFastImageExample-tvOSTests.debug.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-ReactNativeFastImageExample-tvOSTests.debug.xcconfig"; path = "Target Support Files/Pods-ReactNativeFastImageExample-tvOSTests/Pods-ReactNativeFastImageExample-tvOSTests.debug.xcconfig"; sourceTree = "<group>"; };
ED297162215061F000B7C4FE /* JavaScriptCore.framework */ = {isa = PBXFileReference; lastKnownFileType = wrapper.framework; name = JavaScriptCore.framework; path = System/Library/Frameworks/JavaScriptCore.framework; sourceTree = SDKROOT; };
ED2971642150620600B7C4FE /* JavaScriptCore.framework */ = {isa = PBXFileReference; lastKnownFileType = wrapper.framework; name = JavaScriptCore.framework; path = Platforms/AppleTVOS.platform/Developer/SDKs/AppleTVOS12.0.sdk/System/Library/Frameworks/JavaScriptCore.framework; sourceTree = DEVELOPER_DIR; };
EE5420CCEC8C76218298A8A1 /* Pods-ReactNativeFastImageExample-tvOSTests.release.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-ReactNativeFastImageExample-tvOSTests.release.xcconfig"; path = "Target Support Files/Pods-ReactNativeFastImageExample-tvOSTests/Pods-ReactNativeFastImageExample-tvOSTests.release.xcconfig"; sourceTree = "<group>"; };
/* End PBXFileReference section */
/* Begin PBXFrameworksBuildPhase section */
@ -74,7 +74,7 @@
isa = PBXFrameworksBuildPhase;
buildActionMask = 2147483647;
files = (
1829EFD01EDCC120B36DC384 /* libPods-ReactNativeFastImageExampleTests.a in Frameworks */,
7339F561B0CE29B728993582 /* libPods-ReactNativeFastImageExampleTests.a in Frameworks */,
);
runOnlyForDeploymentPostprocessing = 0;
};
@ -82,7 +82,7 @@
isa = PBXFrameworksBuildPhase;
buildActionMask = 2147483647;
files = (
F8C69D5180CB05D63857155A /* libPods-ReactNativeFastImageExample.a in Frameworks */,
7BF37A49DF3174DEBBCD15AF /* libPods-ReactNativeFastImageExample.a in Frameworks */,
);
runOnlyForDeploymentPostprocessing = 0;
};
@ -90,7 +90,7 @@
isa = PBXFrameworksBuildPhase;
buildActionMask = 2147483647;
files = (
8ED0B79327FA1A4B3B6281B4 /* libPods-ReactNativeFastImageExample-tvOS.a in Frameworks */,
DCA1D63D4747298994E20087 /* libPods-ReactNativeFastImageExample-tvOS.a in Frameworks */,
);
runOnlyForDeploymentPostprocessing = 0;
};
@ -98,7 +98,7 @@
isa = PBXFrameworksBuildPhase;
buildActionMask = 2147483647;
files = (
5B76F0ED936BBFCBF369D233 /* libPods-ReactNativeFastImageExample-tvOSTests.a in Frameworks */,
B589F39E663EF2DC2BE53734 /* libPods-ReactNativeFastImageExample-tvOSTests.a in Frameworks */,
);
runOnlyForDeploymentPostprocessing = 0;
};
@ -136,34 +136,35 @@
name = ReactNativeFastImageExample;
sourceTree = "<group>";
};
24E013F858679DCB2ED70BF2 /* Pods */ = {
isa = PBXGroup;
children = (
409CCB29044E2AF2ED6DF4BA /* Pods-ReactNativeFastImageExample.debug.xcconfig */,
AB6AC85AF5F7B0ACC2A0C2F9 /* Pods-ReactNativeFastImageExample.release.xcconfig */,
A14530762FEF5633D3AEC4A8 /* Pods-ReactNativeFastImageExample-tvOS.debug.xcconfig */,
B2ADAAD9246EF7C6F31DB94D /* Pods-ReactNativeFastImageExample-tvOS.release.xcconfig */,
73097A8CB6376953A4C77750 /* Pods-ReactNativeFastImageExample-tvOSTests.debug.xcconfig */,
EE5420CCEC8C76218298A8A1 /* Pods-ReactNativeFastImageExample-tvOSTests.release.xcconfig */,
160E9822226B7DA14DDC0D14 /* Pods-ReactNativeFastImageExampleTests.debug.xcconfig */,
0EA7E3956412991EA7A2CA0C /* Pods-ReactNativeFastImageExampleTests.release.xcconfig */,
);
path = Pods;
sourceTree = "<group>";
};
2D16E6871FA4F8E400B85C8A /* Frameworks */ = {
isa = PBXGroup;
children = (
ED297162215061F000B7C4FE /* JavaScriptCore.framework */,
ED2971642150620600B7C4FE /* JavaScriptCore.framework */,
80915DCF4D7BA073041627FB /* libPods-ReactNativeFastImageExample.a */,
686792D106A578EEBD13F1AF /* libPods-ReactNativeFastImageExample-tvOS.a */,
9B7B0D2E9145E48BDA2976AA /* libPods-ReactNativeFastImageExample-tvOSTests.a */,
BA5F569BE99A43AAF170C1B2 /* libPods-ReactNativeFastImageExampleTests.a */,
B3FA6DA7AADBA70EE7027384 /* libPods-ReactNativeFastImageExample.a */,
0D14914D6626685F198EBC65 /* libPods-ReactNativeFastImageExample-tvOS.a */,
36F2D8488D887812E71A27EF /* libPods-ReactNativeFastImageExample-tvOSTests.a */,
5730E398098D985EEA94844D /* libPods-ReactNativeFastImageExampleTests.a */,
);
name = Frameworks;
sourceTree = "<group>";
};
2DE285898A0F182C8C14FF24 /* Pods */ = {
isa = PBXGroup;
children = (
8E2A7D7E62E9083CAA8F5E5A /* Pods-ReactNativeFastImageExample.debug.xcconfig */,
4F945D662771617B29FCC251 /* Pods-ReactNativeFastImageExample.release.xcconfig */,
90A992153999BEDA2888B03A /* Pods-ReactNativeFastImageExample-tvOS.debug.xcconfig */,
BDAC40DD72EAA22375172E5A /* Pods-ReactNativeFastImageExample-tvOS.release.xcconfig */,
E4E0AD4EA9AF278B80494501 /* Pods-ReactNativeFastImageExample-tvOSTests.debug.xcconfig */,
4BC30000AD6A26886DBE1546 /* Pods-ReactNativeFastImageExample-tvOSTests.release.xcconfig */,
5C5A3370DB6FCFF06A10F2A5 /* Pods-ReactNativeFastImageExampleTests.debug.xcconfig */,
E38D7B34F535ED1EECB9B3FF /* Pods-ReactNativeFastImageExampleTests.release.xcconfig */,
);
name = Pods;
path = Pods;
sourceTree = "<group>";
};
832341AE1AAA6A7D00B99B32 /* Libraries */ = {
isa = PBXGroup;
children = (
@ -179,7 +180,7 @@
00E356EF1AD99517003FC87E /* ReactNativeFastImageExampleTests */,
83CBBA001A601CBA00E9B192 /* Products */,
2D16E6871FA4F8E400B85C8A /* Frameworks */,
24E013F858679DCB2ED70BF2 /* Pods */,
2DE285898A0F182C8C14FF24 /* Pods */,
);
indentWidth = 2;
sourceTree = "<group>";
@ -204,7 +205,7 @@
isa = PBXNativeTarget;
buildConfigurationList = 00E357021AD99517003FC87E /* Build configuration list for PBXNativeTarget "ReactNativeFastImageExampleTests" */;
buildPhases = (
A3C904C455880AE5C8CB30A7 /* [CP] Check Pods Manifest.lock */,
90A0F6843DD36E00EDE760E7 /* [CP] Check Pods Manifest.lock */,
00E356EA1AD99517003FC87E /* Sources */,
00E356EB1AD99517003FC87E /* Frameworks */,
00E356EC1AD99517003FC87E /* Resources */,
@ -223,13 +224,13 @@
isa = PBXNativeTarget;
buildConfigurationList = 13B07F931A680F5B00A75B9A /* Build configuration list for PBXNativeTarget "ReactNativeFastImageExample" */;
buildPhases = (
C9EF48499D14DC6AAB1055EB /* [CP] Check Pods Manifest.lock */,
1C29FF70A1275C410D1130E7 /* [CP] Check Pods Manifest.lock */,
FD10A7F022414F080027D42C /* Start Packager */,
13B07F871A680F5B00A75B9A /* Sources */,
13B07F8C1A680F5B00A75B9A /* Frameworks */,
13B07F8E1A680F5B00A75B9A /* Resources */,
00DD1BFF1BD5951E006B06BC /* Bundle React Native code and images */,
3F4B7383C8858047AC768489 /* [CP] Copy Pods Resources */,
0E5D58080FA5BEA5649E01E2 /* [CP] Copy Pods Resources */,
);
buildRules = (
);
@ -244,7 +245,7 @@
isa = PBXNativeTarget;
buildConfigurationList = 2D02E4BA1E0B4A5E006451C7 /* Build configuration list for PBXNativeTarget "ReactNativeFastImageExample-tvOS" */;
buildPhases = (
88C215EF52A3D9B37FC84F38 /* [CP] Check Pods Manifest.lock */,
8B78132A37384AECF84133EB /* [CP] Check Pods Manifest.lock */,
FD10A7F122414F3F0027D42C /* Start Packager */,
2D02E4771E0B4A5D006451C7 /* Sources */,
2D02E4781E0B4A5D006451C7 /* Frameworks */,
@ -264,7 +265,7 @@
isa = PBXNativeTarget;
buildConfigurationList = 2D02E4BB1E0B4A5E006451C7 /* Build configuration list for PBXNativeTarget "ReactNativeFastImageExample-tvOSTests" */;
buildPhases = (
774E6DFD9644F561C28BE978 /* [CP] Check Pods Manifest.lock */,
12AE9A278A527C278C4A502D /* [CP] Check Pods Manifest.lock */,
2D02E48C1E0B4A5D006451C7 /* Sources */,
2D02E48D1E0B4A5D006451C7 /* Frameworks */,
2D02E48E1E0B4A5D006451C7 /* Resources */,
@ -308,7 +309,6 @@
developmentRegion = English;
hasScannedForEncodings = 0;
knownRegions = (
English,
en,
Base,
);
@ -374,21 +374,7 @@
shellPath = /bin/sh;
shellScript = "export NODE_BINARY=node\n../node_modules/react-native/scripts/react-native-xcode.sh";
};
2D02E4CB1E0B4B27006451C7 /* Bundle React Native Code And Images */ = {
isa = PBXShellScriptBuildPhase;
buildActionMask = 2147483647;
files = (
);
inputPaths = (
);
name = "Bundle React Native Code And Images";
outputPaths = (
);
runOnlyForDeploymentPostprocessing = 0;
shellPath = /bin/sh;
shellScript = "export NODE_BINARY=node\n../node_modules/react-native/scripts/react-native-xcode.sh";
};
3F4B7383C8858047AC768489 /* [CP] Copy Pods Resources */ = {
0E5D58080FA5BEA5649E01E2 /* [CP] Copy Pods Resources */ = {
isa = PBXShellScriptBuildPhase;
buildActionMask = 2147483647;
files = (
@ -436,7 +422,7 @@
shellScript = "\"${PODS_ROOT}/Target Support Files/Pods-ReactNativeFastImageExample/Pods-ReactNativeFastImageExample-resources.sh\"\n";
showEnvVarsInLog = 0;
};
774E6DFD9644F561C28BE978 /* [CP] Check Pods Manifest.lock */ = {
12AE9A278A527C278C4A502D /* [CP] Check Pods Manifest.lock */ = {
isa = PBXShellScriptBuildPhase;
buildActionMask = 2147483647;
files = (
@ -458,7 +444,43 @@
shellScript = "diff \"${PODS_PODFILE_DIR_PATH}/Podfile.lock\" \"${PODS_ROOT}/Manifest.lock\" > /dev/null\nif [ $? != 0 ] ; then\n # print error to STDERR\n echo \"error: The sandbox is not in sync with the Podfile.lock. Run 'pod install' or update your CocoaPods installation.\" >&2\n exit 1\nfi\n# This output is used by Xcode 'outputs' to avoid re-running this script phase.\necho \"SUCCESS\" > \"${SCRIPT_OUTPUT_FILE_0}\"\n";
showEnvVarsInLog = 0;
};
88C215EF52A3D9B37FC84F38 /* [CP] Check Pods Manifest.lock */ = {
1C29FF70A1275C410D1130E7 /* [CP] Check Pods Manifest.lock */ = {
isa = PBXShellScriptBuildPhase;
buildActionMask = 2147483647;
files = (
);
inputFileListPaths = (
);
inputPaths = (
"${PODS_PODFILE_DIR_PATH}/Podfile.lock",
"${PODS_ROOT}/Manifest.lock",
);
name = "[CP] Check Pods Manifest.lock";
outputFileListPaths = (
);
outputPaths = (
"$(DERIVED_FILE_DIR)/Pods-ReactNativeFastImageExample-checkManifestLockResult.txt",
);
runOnlyForDeploymentPostprocessing = 0;
shellPath = /bin/sh;
shellScript = "diff \"${PODS_PODFILE_DIR_PATH}/Podfile.lock\" \"${PODS_ROOT}/Manifest.lock\" > /dev/null\nif [ $? != 0 ] ; then\n # print error to STDERR\n echo \"error: The sandbox is not in sync with the Podfile.lock. Run 'pod install' or update your CocoaPods installation.\" >&2\n exit 1\nfi\n# This output is used by Xcode 'outputs' to avoid re-running this script phase.\necho \"SUCCESS\" > \"${SCRIPT_OUTPUT_FILE_0}\"\n";
showEnvVarsInLog = 0;
};
2D02E4CB1E0B4B27006451C7 /* Bundle React Native Code And Images */ = {
isa = PBXShellScriptBuildPhase;
buildActionMask = 2147483647;
files = (
);
inputPaths = (
);
name = "Bundle React Native Code And Images";
outputPaths = (
);
runOnlyForDeploymentPostprocessing = 0;
shellPath = /bin/sh;
shellScript = "export NODE_BINARY=node\n../node_modules/react-native/scripts/react-native-xcode.sh";
};
8B78132A37384AECF84133EB /* [CP] Check Pods Manifest.lock */ = {
isa = PBXShellScriptBuildPhase;
buildActionMask = 2147483647;
files = (
@ -480,7 +502,7 @@
shellScript = "diff \"${PODS_PODFILE_DIR_PATH}/Podfile.lock\" \"${PODS_ROOT}/Manifest.lock\" > /dev/null\nif [ $? != 0 ] ; then\n # print error to STDERR\n echo \"error: The sandbox is not in sync with the Podfile.lock. Run 'pod install' or update your CocoaPods installation.\" >&2\n exit 1\nfi\n# This output is used by Xcode 'outputs' to avoid re-running this script phase.\necho \"SUCCESS\" > \"${SCRIPT_OUTPUT_FILE_0}\"\n";
showEnvVarsInLog = 0;
};
A3C904C455880AE5C8CB30A7 /* [CP] Check Pods Manifest.lock */ = {
90A0F6843DD36E00EDE760E7 /* [CP] Check Pods Manifest.lock */ = {
isa = PBXShellScriptBuildPhase;
buildActionMask = 2147483647;
files = (
@ -502,28 +524,6 @@
shellScript = "diff \"${PODS_PODFILE_DIR_PATH}/Podfile.lock\" \"${PODS_ROOT}/Manifest.lock\" > /dev/null\nif [ $? != 0 ] ; then\n # print error to STDERR\n echo \"error: The sandbox is not in sync with the Podfile.lock. Run 'pod install' or update your CocoaPods installation.\" >&2\n exit 1\nfi\n# This output is used by Xcode 'outputs' to avoid re-running this script phase.\necho \"SUCCESS\" > \"${SCRIPT_OUTPUT_FILE_0}\"\n";
showEnvVarsInLog = 0;
};
C9EF48499D14DC6AAB1055EB /* [CP] Check Pods Manifest.lock */ = {
isa = PBXShellScriptBuildPhase;
buildActionMask = 2147483647;
files = (
);
inputFileListPaths = (
);
inputPaths = (
"${PODS_PODFILE_DIR_PATH}/Podfile.lock",
"${PODS_ROOT}/Manifest.lock",
);
name = "[CP] Check Pods Manifest.lock";
outputFileListPaths = (
);
outputPaths = (
"$(DERIVED_FILE_DIR)/Pods-ReactNativeFastImageExample-checkManifestLockResult.txt",
);
runOnlyForDeploymentPostprocessing = 0;
shellPath = /bin/sh;
shellScript = "diff \"${PODS_PODFILE_DIR_PATH}/Podfile.lock\" \"${PODS_ROOT}/Manifest.lock\" > /dev/null\nif [ $? != 0 ] ; then\n # print error to STDERR\n echo \"error: The sandbox is not in sync with the Podfile.lock. Run 'pod install' or update your CocoaPods installation.\" >&2\n exit 1\nfi\n# This output is used by Xcode 'outputs' to avoid re-running this script phase.\necho \"SUCCESS\" > \"${SCRIPT_OUTPUT_FILE_0}\"\n";
showEnvVarsInLog = 0;
};
FD10A7F022414F080027D42C /* Start Packager */ = {
isa = PBXShellScriptBuildPhase;
buildActionMask = 2147483647;
@ -629,7 +629,7 @@
/* Begin XCBuildConfiguration section */
00E356F61AD99517003FC87E /* Debug */ = {
isa = XCBuildConfiguration;
baseConfigurationReference = 160E9822226B7DA14DDC0D14 /* Pods-ReactNativeFastImageExampleTests.debug.xcconfig */;
baseConfigurationReference = 5C5A3370DB6FCFF06A10F2A5 /* Pods-ReactNativeFastImageExampleTests.debug.xcconfig */;
buildSettings = {
BUNDLE_LOADER = "$(TEST_HOST)";
GCC_PREPROCESSOR_DEFINITIONS = (
@ -652,7 +652,7 @@
};
00E356F71AD99517003FC87E /* Release */ = {
isa = XCBuildConfiguration;
baseConfigurationReference = 0EA7E3956412991EA7A2CA0C /* Pods-ReactNativeFastImageExampleTests.release.xcconfig */;
baseConfigurationReference = E38D7B34F535ED1EECB9B3FF /* Pods-ReactNativeFastImageExampleTests.release.xcconfig */;
buildSettings = {
BUNDLE_LOADER = "$(TEST_HOST)";
COPY_PHASE_STRIP = NO;
@ -672,7 +672,7 @@
};
13B07F941A680F5B00A75B9A /* Debug */ = {
isa = XCBuildConfiguration;
baseConfigurationReference = 409CCB29044E2AF2ED6DF4BA /* Pods-ReactNativeFastImageExample.debug.xcconfig */;
baseConfigurationReference = 8E2A7D7E62E9083CAA8F5E5A /* Pods-ReactNativeFastImageExample.debug.xcconfig */;
buildSettings = {
ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
CURRENT_PROJECT_VERSION = 1;
@ -692,7 +692,7 @@
};
13B07F951A680F5B00A75B9A /* Release */ = {
isa = XCBuildConfiguration;
baseConfigurationReference = AB6AC85AF5F7B0ACC2A0C2F9 /* Pods-ReactNativeFastImageExample.release.xcconfig */;
baseConfigurationReference = 4F945D662771617B29FCC251 /* Pods-ReactNativeFastImageExample.release.xcconfig */;
buildSettings = {
ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
CURRENT_PROJECT_VERSION = 1;
@ -711,7 +711,7 @@
};
2D02E4971E0B4A5E006451C7 /* Debug */ = {
isa = XCBuildConfiguration;
baseConfigurationReference = A14530762FEF5633D3AEC4A8 /* Pods-ReactNativeFastImageExample-tvOS.debug.xcconfig */;
baseConfigurationReference = 90A992153999BEDA2888B03A /* Pods-ReactNativeFastImageExample-tvOS.debug.xcconfig */;
buildSettings = {
ASSETCATALOG_COMPILER_APPICON_NAME = "App Icon & Top Shelf Image";
ASSETCATALOG_COMPILER_LAUNCHIMAGE_NAME = LaunchImage;
@ -739,7 +739,7 @@
};
2D02E4981E0B4A5E006451C7 /* Release */ = {
isa = XCBuildConfiguration;
baseConfigurationReference = B2ADAAD9246EF7C6F31DB94D /* Pods-ReactNativeFastImageExample-tvOS.release.xcconfig */;
baseConfigurationReference = BDAC40DD72EAA22375172E5A /* Pods-ReactNativeFastImageExample-tvOS.release.xcconfig */;
buildSettings = {
ASSETCATALOG_COMPILER_APPICON_NAME = "App Icon & Top Shelf Image";
ASSETCATALOG_COMPILER_LAUNCHIMAGE_NAME = LaunchImage;
@ -767,7 +767,7 @@
};
2D02E4991E0B4A5E006451C7 /* Debug */ = {
isa = XCBuildConfiguration;
baseConfigurationReference = 73097A8CB6376953A4C77750 /* Pods-ReactNativeFastImageExample-tvOSTests.debug.xcconfig */;
baseConfigurationReference = E4E0AD4EA9AF278B80494501 /* Pods-ReactNativeFastImageExample-tvOSTests.debug.xcconfig */;
buildSettings = {
BUNDLE_LOADER = "$(TEST_HOST)";
CLANG_ANALYZER_NONNULL = YES;
@ -794,7 +794,7 @@
};
2D02E49A1E0B4A5E006451C7 /* Release */ = {
isa = XCBuildConfiguration;
baseConfigurationReference = EE5420CCEC8C76218298A8A1 /* Pods-ReactNativeFastImageExample-tvOSTests.release.xcconfig */;
baseConfigurationReference = 4BC30000AD6A26886DBE1546 /* Pods-ReactNativeFastImageExample-tvOSTests.release.xcconfig */;
buildSettings = {
BUNDLE_LOADER = "$(TEST_HOST)";
CLANG_ANALYZER_NONNULL = YES;

View File

@ -1,8 +0,0 @@
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
<key>IDEDidComputeMac32BitWarning</key>
<true/>
</dict>
</plist>

View File

@ -5,9 +5,20 @@
"scripts": {
"android": "react-native run-android",
"ios": "react-native run-ios",
"lint": "eslint . --ext .js,.jsx,.ts,.tsx",
"start": "react-native start",
"test": "jest",
"lint": "eslint ."
"test": "jest"
},
"jest": {
"moduleFileExtensions": [
"ts",
"tsx",
"js",
"jsx",
"json",
"node"
],
"preset": "react-native"
},
"dependencies": {
"@react-native-community/masked-view": "^0.1.7",
@ -16,7 +27,7 @@
"@react-navigation/stack": "^5.1.0",
"react": "16.9.0",
"react-native": "0.61.5",
"react-native-fast-image": "../react-native-fast-image-8.0.0.tgz",
"react-native-fast-image": "^8.1.3",
"react-native-gesture-handler": "^1.6.0",
"react-native-image-picker": "^2.3.1",
"react-native-image-progress": "^1.1.1",
@ -25,20 +36,23 @@
"react-native-screens": "^2.2.0",
"react-native-status-bar-height": "^2.1.0",
"react-native-vector-icons": "^6.6.0",
"react-timeout": "^1.1.2",
"uuid": "^7.0.1"
"react-timeout": "^1.1.2"
},
"devDependencies": {
"@babel/core": "^7.6.2",
"@babel/runtime": "^7.6.2",
"@react-native-community/eslint-config": "^0.0.5",
"@types/jest": "^24.0.24",
"@types/react-native": "^0.60.25",
"@types/react-native-vector-icons": "^6.4.5",
"@types/react-test-renderer": "16.9.1",
"@typescript-eslint/eslint-plugin": "^2.12.0",
"@typescript-eslint/parser": "^2.12.0",
"babel-jest": "^24.9.0",
"eslint": "^6.5.1",
"jest": "^24.9.0",
"metro-react-native-babel-preset": "^0.56.0",
"react-test-renderer": "16.9.0"
},
"jest": {
"preset": "react-native"
"react-test-renderer": "16.9.0",
"typescript": "^3.8.3"
}
}

View File

@ -2,20 +2,35 @@ import React, { Component } from 'react'
import { StyleSheet, View } from 'react-native'
import withCacheBust from './withCacheBust'
import SectionFlex from './SectionFlex'
import FastImage from 'react-native-fast-image'
import FastImage, { FastImageProps } from 'react-native-fast-image'
import Section from './Section'
import FeatureText from './FeatureText'
const GIF_URL =
'https://cdn-images-1.medium.com/max/1600/1*-CY5bU4OqiJRox7G00sftw.gif'
class AutoSizingImage extends Component {
interface AutoSizingImageProps extends FastImageProps {
onLoad?: (event: any) => void
defaultHeight?: number
width: number
style?: any
}
interface AutoSizingImageState {
height: number
width: number
}
class AutoSizingImage extends Component<
AutoSizingImageProps,
AutoSizingImageState
> {
state = {
height: 0,
width: 0,
}
onLoad = e => {
onLoad = (e: any) => {
const {
nativeEvent: { width, height },
} = e
@ -27,7 +42,9 @@ class AutoSizingImage extends Component {
getHeight = () => {
if (!this.state.height) {
return this.props.defaultHeight
return this.props.defaultHeight === undefined
? 300
: this.props.defaultHeight
}
const ratio = this.state.height / this.state.width
const height = this.props.width * ratio
@ -46,11 +63,12 @@ class AutoSizingImage extends Component {
}
}
AutoSizingImage.defaultProps = {
defaultHeight: 300,
interface AutoSizeExampleProps {
onPressReload: () => void
bust: boolean
}
const AutoSizeExample = ({ onPressReload, bust }) => (
const AutoSizeExample = ({ onPressReload, bust }: AutoSizeExampleProps) => (
<View>
<Section>
<FeatureText text="• AutoSize." />

View File

@ -8,7 +8,15 @@ import FeatureText from './FeatureText'
const IMAGE_URL = 'https://media.giphy.com/media/GEsoqZDGVoisw/giphy.gif'
const BorderRadiusExample = ({ onPressReload, bust }) => (
interface BorderRadiusExampleProps {
onPressReload: () => void
bust: string
}
const BorderRadiusExample = ({
onPressReload,
bust,
}: BorderRadiusExampleProps) => (
<View>
<Section>
<FeatureText text="• Border radius." />

View File

@ -1,7 +1,12 @@
import React from 'react'
import FeatureText from './FeatureText'
const BulletText = ({ text, children }) => (
interface BulletTextProps {
text?: string
children?: any
}
const BulletText = ({ text, children }: BulletTextProps) => (
<FeatureText text={`${text || children}`} />
)

View File

@ -1,7 +1,12 @@
import React from 'react'
import { StyleSheet, Text, TouchableOpacity, View } from 'react-native'
const Button = ({ text, onPress }) => (
interface ButtonProps {
text: string
onPress: () => void
}
const Button = ({ text, onPress }: ButtonProps) => (
<TouchableOpacity onPress={onPress}>
<View style={styles.button}>
<Text style={styles.text}>{text}</Text>

View File

@ -1,12 +0,0 @@
import React from 'react'
import { StyleSheet, Text } from 'react-native'
export default ({ text, style, children }) => (
<Text style={[styles.style, style]}>{text || children}</Text>
)
const styles = StyleSheet.create({
style: {
color: '#222',
},
})

View File

@ -0,0 +1,22 @@
import React from 'react'
import { StyleSheet, Text } from 'react-native'
interface FeatureTextProps {
text?: string
style?: any
children?: any
}
export default function FeatureText({
text,
style,
children,
}: FeatureTextProps) {
return <Text style={[styles.style, style]}>{text || children}</Text>
}
const styles = StyleSheet.create({
style: {
color: '#222',
},
})

View File

@ -9,7 +9,12 @@ import FeatureText from './FeatureText'
const GIF_URL =
'https://cdn-images-1.medium.com/max/1600/1*-CY5bU4OqiJRox7G00sftw.gif'
const GifExample = ({ onPressReload, bust }) => (
interface GifExampleProps {
onPressReload: () => void
bust: boolean
}
const GifExample = ({ onPressReload, bust }: GifExampleProps) => (
<View>
<Section>
<FeatureText text="• GIF support." />

View File

@ -1,7 +1,13 @@
import React from 'react'
import Base from 'react-native-vector-icons/Ionicons'
export function Icon({ size, name, color }) {
interface IconProps {
size?: number
name: string
color: string
}
export function Icon({ size, name, color }: IconProps) {
return (
<Base
name={name}

View File

@ -1,26 +1,45 @@
import React, { Component } from 'react'
import { FlatList, StyleSheet, Text, View } from 'react-native'
import {
FlatList,
StyleSheet,
Text,
View,
LayoutChangeEvent,
} from 'react-native'
import StatusBarUnderlay, { STATUS_BAR_HEIGHT } from './StatusBarUnderlay'
const getImageUrl = (id, width, height) =>
const getImageUrl = (id: string, width: number, height: number) =>
`https://unsplash.it/${width}/${height}?image=${id}`
class ImageGrid extends Component {
constructor(props) {
super(props)
interface ImageGridProps {
ImageComponent: React.ComponentType<any>
}
interface ImageGridState {
images: any[]
itemHeight: number
error?: any
}
class ImageGrid extends Component<ImageGridProps, ImageGridState> {
constructor(props: ImageGridProps) {
super(props)
fetch('https://unsplash.it/list')
.then(res => res.json())
.then(this._onFetchImagesSuccess)
.catch(this._onFetchImagesError)
}
state = {
state: {
images: any[]
itemHeight: number
error?: any
} = {
images: [],
itemHeight: 0,
}
_onLayout = e => {
_onLayout = (e: LayoutChangeEvent) => {
const width = e.nativeEvent.layout.width
this.setState({
itemHeight: width / 4,
@ -33,18 +52,18 @@ class ImageGrid extends Component {
})
}
_onFetchImagesSuccess = images => {
_onFetchImagesSuccess = (images: any[]) => {
this.setState({
images,
})
}
_getItemLayout = (data, index) => {
_getItemLayout = (_: any, index: number) => {
const { itemHeight } = this.state
return { length: itemHeight, offset: itemHeight * index, index }
}
_renderItem = ({ item }) => {
_renderItem = ({ item }: { item: any }) => {
const ImageComponent = this.props.ImageComponent
const uri = getImageUrl(item.id, 100, 100)
return (
@ -54,7 +73,7 @@ class ImageGrid extends Component {
)
}
_extractKey = item => {
_extractKey = (item: any) => {
return item.id
}
@ -111,8 +130,8 @@ const styles = StyleSheet.create({
},
image: {
flex: 1,
width: null,
height: null,
width: null as any,
height: null as any,
margin: MARGIN,
backgroundColor: '#eee',
},

View File

@ -1,17 +1,28 @@
import React, { Component } from 'react'
import { StyleSheet, View, Text, TouchableOpacity } from 'react-native'
import {
StyleSheet,
View,
Text,
TouchableOpacity,
ViewProps,
} from 'react-native'
import withCacheBust from './withCacheBust'
import FastImage from 'react-native-fast-image'
import FastImage, { FastImageProps, Source } from 'react-native-fast-image'
import Section from './Section'
import FeatureText from './FeatureText'
import FieldsImage from './images/fields.jpg'
import FieldsBase64 from './images/fields.js'
import FieldsWebP from './images/fields.webp'
import JellyfishGIF from './images/jellyfish.gif'
import JellyfishWebP from './images/jellyfish.webp'
import FieldsBase64 from './images/fields'
import ImagePicker from 'react-native-image-picker'
import BulletText from './BulletText'
// @ts-ignore
import FieldsImage from './images/fields.jpg'
// @ts-ignore
import FieldsWebP from './images/fields.webp'
// @ts-ignore
import JellyfishGIF from './images/jellyfish.gif'
// @ts-ignore
import JellyfishWebP from './images/jellyfish.webp'
const options = {
title: 'Select Avatar',
customButtons: [{ name: 'fb', title: 'Choose Photo from Facebook' }],
@ -21,21 +32,32 @@ const options = {
},
}
const Image = ({ source, ...p }) => (
const Image = ({ source, ...p }: FastImageProps) => (
<FastImage style={styles.imageSquare} source={source} {...p} />
)
const Row = p => <View style={styles.row} {...p} />
const Row: React.ComponentType<ViewProps> = (p: ViewProps) => (
<View style={styles.row} {...p} />
)
const Example = ({ name, source }) => (
interface ExampleProps {
name: string
source: any
}
const Example = ({ name, source }: ExampleProps) => (
<Row>
<BulletText>{name}</BulletText>
<Image source={source} />
</Row>
)
class PhotoExample extends Component {
state = {}
interface PhotoExampleState {
image?: Source
}
class PhotoExample extends Component<{}, PhotoExampleState> {
state: PhotoExampleState = {}
pick = () => {
ImagePicker.showImagePicker(options, response => {
@ -59,7 +81,10 @@ class PhotoExample extends Component {
<Row>
<BulletText>photo library</BulletText>
<TouchableOpacity onPress={this.pick}>
<Image style={styles.imageSquare} source={this.state.image}>
<Image
style={styles.imageSquare}
source={this.state.image || 0}
>
<Text style={styles.pickPhoto}>Pick Photo</Text>
</Image>
</TouchableOpacity>

View File

@ -4,8 +4,8 @@ import SectionFlex from './SectionFlex'
import FastImage from 'react-native-fast-image'
import Section from './Section'
import FeatureText from './FeatureText'
import { v4 as uuid } from 'uuid'
import Button from './Button'
// @ts-ignore
import { createImageProgress } from 'react-native-image-progress'
const IMAGE_URL =
@ -13,14 +13,16 @@ const IMAGE_URL =
const Image = createImageProgress(FastImage)
class PreloadExample extends Component {
interface PreloadExampleProps {}
class PreloadExample extends Component<PreloadExampleProps> {
state = {
show: false,
url: IMAGE_URL,
}
bustCache = () => {
const key = uuid()
const key = Math.random().toString()
const bust = `?bust=${key}`
// Preload images. This can be called anywhere.
const url = IMAGE_URL + bust
@ -45,10 +47,7 @@ class PreloadExample extends Component {
<FeatureText text="• Preloading." />
<FeatureText text="• Progress indication using react-native-image-progress." />
</Section>
<SectionFlex
style={styles.section}
onPress={this.props.onPressReload}
>
<SectionFlex style={styles.section}>
{this.state.show ? (
<Image
style={styles.image}

View File

@ -6,7 +6,7 @@ import Section from './Section'
import SectionFlex from './SectionFlex'
import FeatureText from './FeatureText'
const getImageUrl = (id, width, height) =>
const getImageUrl = (id: string, width: number, height: number) =>
`https://source.unsplash.com/${id}/${width}x${height}`
const IMAGE_SIZE = 1024
const IMAGE_SIZE_PX = PixelRatio.getPixelSizeForLayoutSize(IMAGE_SIZE)
@ -16,7 +16,12 @@ const IMAGE_URLS = [
getImageUrl('S7VCcp6KCKE', IMAGE_SIZE, IMAGE_SIZE),
]
const PriorityExample = ({ onPressReload, bust }) => (
interface PriorityExampleProps {
onPressReload: () => void
bust: string
}
const PriorityExample = ({ onPressReload, bust }: PriorityExampleProps) => (
<View>
<Section>
<FeatureText text="• Prioritize images (low, normal, high)." />

View File

@ -8,9 +8,24 @@ import FeatureText from './FeatureText'
const IMAGE_URL = 'https://media.giphy.com/media/GEsoqZDGVoisw/giphy.gif'
class ProgressExample extends Component {
state = {
mount: new Date(),
interface ProgressExampleProps {
onPressReload: () => void
bust: string
}
interface ProgressExampleState {
mount: number
start?: number
progress?: number
end?: number
}
class ProgressExample extends Component<
ProgressExampleProps,
ProgressExampleState
> {
state: ProgressExampleState = {
mount: Date.now(),
start: undefined,
progress: undefined,
end: undefined,

View File

@ -8,7 +8,7 @@ import BulletText from './BulletText'
const IMAGE_URL = 'https://media.giphy.com/media/GEsoqZDGVoisw/giphy.gif'
const Col = p => <View style={styles.col} {...p} />
const Col = (p: any) => <View style={styles.col} {...p} />
const ResizeModeExample = () => (
<View>

View File

@ -1,7 +1,13 @@
import React from 'react'
import { StyleSheet, View } from 'react-native'
export default ({ children }) => <View style={styles.section}>{children}</View>
interface SectionProps {
children?: any
}
export default function Section({ children }: SectionProps) {
return <View style={styles.section}>{children}</View>
}
const styles = StyleSheet.create({
section: {

View File

@ -1,14 +1,25 @@
import React from 'react'
import { StyleSheet, TouchableOpacity, View } from 'react-native'
export default ({ children, onPress, style }) =>
onPress ? (
interface SectionFlexProps {
style?: any
onPress?: () => void
children?: any
}
export default function SectionFlex({
children,
onPress,
style,
}: SectionFlexProps) {
return onPress ? (
<TouchableOpacity style={[styles.sectionFlex, style]} onPress={onPress}>
{children}
</TouchableOpacity>
) : (
<View style={[styles.sectionFlex, style]}>{children}</View>
)
}
const styles = StyleSheet.create({
sectionFlex: {

View File

@ -5,9 +5,15 @@ import FastImage from 'react-native-fast-image'
import Section from './Section'
import SectionFlex from './SectionFlex'
import FeatureText from './FeatureText'
// @ts-ignore
import LogoImage from './images/logo.png'
const TintColorExample = ({ onPressReload }) => (
interface TintColorExampleProps {
onPressReload: () => void
}
const TintColorExample = ({ onPressReload }: TintColorExampleProps) => (
<View>
<Section>
<FeatureText text="Images with tint color." />

View File

@ -1,13 +1,15 @@
import React, { Component } from 'react'
import { v4 as uuid } from 'uuid'
export default BaseComponent => {
export default function withCacheBust(BaseComponent: React.ComponentType<any>) {
class WithCacheBust extends Component {
state = { bust: '?bust' }
static displayName = `withCacheBust(${BaseComponent.displayName ||
BaseComponent.name})`
onPressReload = () => {
// Force complete re-render and bust image cache.
const key = uuid()
const key = Math.random().toString()
const bust = `?bust=${key}`
this.setState({ bust })
}
@ -22,8 +24,5 @@ export default BaseComponent => {
}
}
WithCacheBust.displayName = `withCacheBust(${BaseComponent.displayName ||
BaseComponent.name})`
return WithCacheBust
}

View File

@ -0,0 +1,63 @@
{
"compilerOptions": {
/* Basic Options */
"target": "esnext", /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017','ES2018' or 'ESNEXT'. */
"module": "commonjs", /* Specify module code generation: 'none', 'commonjs', 'amd', 'system', 'umd', 'es2015', or 'ESNext'. */
"lib": ["es6"], /* Specify library files to be included in the compilation. */
"allowJs": true, /* Allow javascript files to be compiled. */
// "checkJs": true, /* Report errors in .js files. */
"jsx": "react-native", /* Specify JSX code generation: 'preserve', 'react-native', or 'react'. */
// "declaration": true, /* Generates corresponding '.d.ts' file. */
// "sourceMap": true, /* Generates corresponding '.map' file. */
// "outFile": "./", /* Concatenate and emit output to single file. */
// "outDir": "./", /* Redirect output structure to the directory. */
// "rootDir": "./", /* Specify the root directory of input files. Use to control the output directory structure with --outDir. */
// "removeComments": true, /* Do not emit comments to output. */
"noEmit": true, /* Do not emit outputs. */
"incremental": false, /* Enable incremental compilation */
// "importHelpers": true, /* Import emit helpers from 'tslib'. */
// "downlevelIteration": true, /* Provide full support for iterables in 'for-of', spread, and destructuring when targeting 'ES5' or 'ES3'. */
"isolatedModules": true, /* Transpile each file as a separate module (similar to 'ts.transpileModule'). */
/* Strict Type-Checking Options */
"strict": true, /* Enable all strict type-checking options. */
// "noImplicitAny": true, /* Raise error on expressions and declarations with an implied 'any' type. */
// "strictNullChecks": true, /* Enable strict null checks. */
// "strictFunctionTypes": true, /* Enable strict checking of function types. */
// "strictPropertyInitialization": true, /* Enable strict checking of property initialization in classes. */
// "noImplicitThis": true, /* Raise error on 'this' expressions with an implied 'any' type. */
// "alwaysStrict": true, /* Parse in strict mode and emit "use strict" for each source file. */
/* Additional Checks */
// "noUnusedLocals": true, /* Report errors on unused locals. */
// "noUnusedParameters": true, /* Report errors on unused parameters. */
// "noImplicitReturns": true, /* Report error when not all code paths in function return a value. */
// "noFallthroughCasesInSwitch": true, /* Report errors for fallthrough cases in switch statement. */
/* Module Resolution Options */
"moduleResolution": "node", /* Specify module resolution strategy: 'node' (Node.js) or 'classic' (TypeScript pre-1.6). */
"baseUrl": "./", /* Base directory to resolve non-absolute module names. */
// "paths": {}, /* A series of entries which re-map imports to lookup locations relative to the 'baseUrl'. */
// "rootDirs": [], /* List of root folders whose combined content represents the structure of the project at runtime. */
// "typeRoots": [], /* List of folders to include type definitions from. */
// "types": [], /* Type declaration files to be included in compilation. */
"allowSyntheticDefaultImports": true, /* Allow default imports from modules with no default export. This does not affect code emit, just typechecking. */
"esModuleInterop": true, /* Enables emit interoperability between CommonJS and ES Modules via creation of namespace objects for all imports. Implies 'allowSyntheticDefaultImports'. */
// "preserveSymlinks": true, /* Do not resolve the real path of symlinks. */
/* Source Map Options */
// "sourceRoot": "./", /* Specify the location where debugger should locate TypeScript files instead of source locations. */
// "mapRoot": "./", /* Specify the location where debugger should locate map files instead of generated locations. */
// "inlineSourceMap": true, /* Emit a single file with source maps instead of having a separate file. */
// "inlineSources": true, /* Emit the source alongside the sourcemaps within a single file; requires '--inlineSourceMap' or '--sourceMap' to be set. */
/* Experimental Options */
// "experimentalDecorators": true, /* Enables experimental support for ES7 decorators. */
// "emitDecoratorMetadata": true, /* Enables experimental support for emitting type metadata for decorators. */
"skipLibCheck": true
},
"exclude": [
"node_modules", "babel.config.js", "metro.config.js", "jest.config.js"
]
}

File diff suppressed because it is too large Load Diff