= ({source}) => {
9 | return ;
10 | };
11 |
12 | const styles = StyleSheet.create({
13 | image: {
14 | aspectRatio: 1,
15 | width: '100%',
16 | objectFit: 'contain',
17 | backgroundColor: 'black',
18 | },
19 | });
20 |
21 | export default PreviewImage;
22 |
--------------------------------------------------------------------------------
/translate-text/example/android/app/src/debug/AndroidManifest.xml:
--------------------------------------------------------------------------------
1 |
2 |
4 |
5 |
6 |
7 |
11 |
12 |
13 |
14 |
--------------------------------------------------------------------------------
/identify-languages/example/android/app/src/debug/AndroidManifest.xml:
--------------------------------------------------------------------------------
1 |
2 |
4 |
5 |
6 |
7 |
11 |
12 |
13 |
14 |
--------------------------------------------------------------------------------
/example/android/app/src/debug/AndroidManifest.xml:
--------------------------------------------------------------------------------
1 |
2 |
4 |
5 |
6 |
7 |
11 |
12 |
13 |
14 |
--------------------------------------------------------------------------------
/barcode-scanning/.gitignore:
--------------------------------------------------------------------------------
1 | # OSX
2 | #
3 | .DS_Store
4 |
5 | # node.js
6 | #
7 | node_modules/
8 | npm-debug.log
9 | yarn-error.log
10 |
11 | # Xcode
12 | #
13 | build/
14 | *.pbxuser
15 | !default.pbxuser
16 | *.mode1v3
17 | !default.mode1v3
18 | *.mode2v3
19 | !default.mode2v3
20 | *.perspectivev3
21 | !default.perspectivev3
22 | xcuserdata
23 | *.xccheckout
24 | *.moved-aside
25 | DerivedData
26 | *.hmap
27 | *.ipa
28 | *.xcuserstate
29 | project.xcworkspace
30 |
31 | # Android/IntelliJ
32 | #
33 | build/
34 | .idea
35 | .gradle
36 | local.properties
37 | *.iml
38 |
39 | # BUCK
40 | buck-out/
41 | \.buckd/
42 | *.keystore
43 |
--------------------------------------------------------------------------------
/face-detection/.gitignore:
--------------------------------------------------------------------------------
1 | # OSX
2 | #
3 | .DS_Store
4 |
5 | # node.js
6 | #
7 | node_modules/
8 | npm-debug.log
9 | yarn-error.log
10 |
11 | # Xcode
12 | #
13 | build/
14 | *.pbxuser
15 | !default.pbxuser
16 | *.mode1v3
17 | !default.mode1v3
18 | *.mode2v3
19 | !default.mode2v3
20 | *.perspectivev3
21 | !default.perspectivev3
22 | xcuserdata
23 | *.xccheckout
24 | *.moved-aside
25 | DerivedData
26 | *.hmap
27 | *.ipa
28 | *.xcuserstate
29 | project.xcworkspace
30 |
31 | # Android/IntelliJ
32 | #
33 | build/
34 | .idea
35 | .gradle
36 | local.properties
37 | *.iml
38 |
39 | # BUCK
40 | buck-out/
41 | \.buckd/
42 | *.keystore
43 |
--------------------------------------------------------------------------------
/identify-languages/.gitignore:
--------------------------------------------------------------------------------
1 | # OSX
2 | #
3 | .DS_Store
4 |
5 | # node.js
6 | #
7 | node_modules/
8 | npm-debug.log
9 | yarn-error.log
10 |
11 | # Xcode
12 | #
13 | build/
14 | *.pbxuser
15 | !default.pbxuser
16 | *.mode1v3
17 | !default.mode1v3
18 | *.mode2v3
19 | !default.mode2v3
20 | *.perspectivev3
21 | !default.perspectivev3
22 | xcuserdata
23 | *.xccheckout
24 | *.moved-aside
25 | DerivedData
26 | *.hmap
27 | *.ipa
28 | *.xcuserstate
29 | project.xcworkspace
30 |
31 | # Android/IntelliJ
32 | #
33 | build/
34 | .idea
35 | .gradle
36 | local.properties
37 | *.iml
38 |
39 | # BUCK
40 | buck-out/
41 | \.buckd/
42 | *.keystore
43 |
--------------------------------------------------------------------------------
/image-labeling/.gitignore:
--------------------------------------------------------------------------------
1 | # OSX
2 | #
3 | .DS_Store
4 |
5 | # node.js
6 | #
7 | node_modules/
8 | npm-debug.log
9 | yarn-error.log
10 |
11 | # Xcode
12 | #
13 | build/
14 | *.pbxuser
15 | !default.pbxuser
16 | *.mode1v3
17 | !default.mode1v3
18 | *.mode2v3
19 | !default.mode2v3
20 | *.perspectivev3
21 | !default.perspectivev3
22 | xcuserdata
23 | *.xccheckout
24 | *.moved-aside
25 | DerivedData
26 | *.hmap
27 | *.ipa
28 | *.xcuserstate
29 | project.xcworkspace
30 |
31 | # Android/IntelliJ
32 | #
33 | build/
34 | .idea
35 | .gradle
36 | local.properties
37 | *.iml
38 |
39 | # BUCK
40 | buck-out/
41 | \.buckd/
42 | *.keystore
43 |
--------------------------------------------------------------------------------
/text-recognition/.gitignore:
--------------------------------------------------------------------------------
1 | # OSX
2 | #
3 | .DS_Store
4 |
5 | # node.js
6 | #
7 | node_modules/
8 | npm-debug.log
9 | yarn-error.log
10 |
11 | # Xcode
12 | #
13 | build/
14 | *.pbxuser
15 | !default.pbxuser
16 | *.mode1v3
17 | !default.mode1v3
18 | *.mode2v3
19 | !default.mode2v3
20 | *.perspectivev3
21 | !default.perspectivev3
22 | xcuserdata
23 | *.xccheckout
24 | *.moved-aside
25 | DerivedData
26 | *.hmap
27 | *.ipa
28 | *.xcuserstate
29 | project.xcworkspace
30 |
31 | # Android/IntelliJ
32 | #
33 | build/
34 | .idea
35 | .gradle
36 | local.properties
37 | *.iml
38 |
39 | # BUCK
40 | buck-out/
41 | \.buckd/
42 | *.keystore
43 |
--------------------------------------------------------------------------------
/translate-text/.gitignore:
--------------------------------------------------------------------------------
1 | # OSX
2 | #
3 | .DS_Store
4 |
5 | # node.js
6 | #
7 | node_modules/
8 | npm-debug.log
9 | yarn-error.log
10 |
11 | # Xcode
12 | #
13 | build/
14 | *.pbxuser
15 | !default.pbxuser
16 | *.mode1v3
17 | !default.mode1v3
18 | *.mode2v3
19 | !default.mode2v3
20 | *.perspectivev3
21 | !default.perspectivev3
22 | xcuserdata
23 | *.xccheckout
24 | *.moved-aside
25 | DerivedData
26 | *.hmap
27 | *.ipa
28 | *.xcuserstate
29 | project.xcworkspace
30 |
31 | # Android/IntelliJ
32 | #
33 | build/
34 | .idea
35 | .gradle
36 | local.properties
37 | *.iml
38 |
39 | # BUCK
40 | buck-out/
41 | \.buckd/
42 | *.keystore
43 |
--------------------------------------------------------------------------------
/example/android/build.gradle:
--------------------------------------------------------------------------------
1 | // Top-level build file where you can add configuration options common to all sub-projects/modules.
2 |
3 | buildscript {
4 | ext {
5 | buildToolsVersion = "33.0.0"
6 | minSdkVersion = 21
7 | compileSdkVersion = 33
8 | targetSdkVersion = 33
9 |
10 | // We use NDK 23 which has both M1 support and is the side-by-side NDK version from AGP.
11 | ndkVersion = "23.1.7779620"
12 | }
13 | repositories {
14 | google()
15 | mavenCentral()
16 | }
17 | dependencies {
18 | classpath("com.android.tools.build:gradle")
19 | classpath("com.facebook.react:react-native-gradle-plugin")
20 | }
21 | }
22 |
--------------------------------------------------------------------------------
/translate-text/example/android/app/build_defs.bzl:
--------------------------------------------------------------------------------
1 | """Helper definitions to glob .aar and .jar targets"""
2 |
3 | def create_aar_targets(aarfiles):
4 | for aarfile in aarfiles:
5 | name = "aars__" + aarfile[aarfile.rindex("/") + 1:aarfile.rindex(".aar")]
6 | lib_deps.append(":" + name)
7 | android_prebuilt_aar(
8 | name = name,
9 | aar = aarfile,
10 | )
11 |
12 | def create_jar_targets(jarfiles):
13 | for jarfile in jarfiles:
14 | name = "jars__" + jarfile[jarfile.rindex("/") + 1:jarfile.rindex(".jar")]
15 | lib_deps.append(":" + name)
16 | prebuilt_jar(
17 | name = name,
18 | binary_jar = jarfile,
19 | )
20 |
--------------------------------------------------------------------------------
/identify-languages/example/android/app/build_defs.bzl:
--------------------------------------------------------------------------------
1 | """Helper definitions to glob .aar and .jar targets"""
2 |
3 | def create_aar_targets(aarfiles):
4 | for aarfile in aarfiles:
5 | name = "aars__" + aarfile[aarfile.rindex("/") + 1:aarfile.rindex(".aar")]
6 | lib_deps.append(":" + name)
7 | android_prebuilt_aar(
8 | name = name,
9 | aar = aarfile,
10 | )
11 |
12 | def create_jar_targets(jarfiles):
13 | for jarfile in jarfiles:
14 | name = "jars__" + jarfile[jarfile.rindex("/") + 1:jarfile.rindex(".jar")]
15 | lib_deps.append(":" + name)
16 | prebuilt_jar(
17 | name = name,
18 | binary_jar = jarfile,
19 | )
20 |
--------------------------------------------------------------------------------
/face-detection/android/README.md:
--------------------------------------------------------------------------------
1 | README
2 | ======
3 |
4 | If you want to publish the lib as a maven dependency, follow these steps before publishing a new version to npm:
5 |
6 | 1. Be sure to have the Android [SDK](https://developer.android.com/studio/index.html) and [NDK](https://developer.android.com/ndk/guides/index.html) installed
7 | 2. Be sure to have a `local.properties` file in this folder that points to the Android SDK and NDK
8 | ```
9 | ndk.dir=/Users/{username}/Library/Android/sdk/ndk-bundle
10 | sdk.dir=/Users/{username}/Library/Android/sdk
11 | ```
12 | 3. Delete the `maven` folder
13 | 4. Run `./gradlew installArchives`
14 | 5. Verify that latest set of generated files is in the maven folder with the correct version number
15 |
--------------------------------------------------------------------------------
/image-labeling/android/README.md:
--------------------------------------------------------------------------------
1 | README
2 | ======
3 |
4 | If you want to publish the lib as a maven dependency, follow these steps before publishing a new version to npm:
5 |
6 | 1. Be sure to have the Android [SDK](https://developer.android.com/studio/index.html) and [NDK](https://developer.android.com/ndk/guides/index.html) installed
7 | 2. Be sure to have a `local.properties` file in this folder that points to the Android SDK and NDK
8 | ```
9 | ndk.dir=/Users/{username}/Library/Android/sdk/ndk-bundle
10 | sdk.dir=/Users/{username}/Library/Android/sdk
11 | ```
12 | 3. Delete the `maven` folder
13 | 4. Run `./gradlew installArchives`
14 | 5. Verify that latest set of generated files is in the maven folder with the correct version number
15 |
--------------------------------------------------------------------------------
/text-recognition/android/README.md:
--------------------------------------------------------------------------------
1 | README
2 | ======
3 |
4 | If you want to publish the lib as a maven dependency, follow these steps before publishing a new version to npm:
5 |
6 | 1. Be sure to have the Android [SDK](https://developer.android.com/studio/index.html) and [NDK](https://developer.android.com/ndk/guides/index.html) installed
7 | 2. Be sure to have a `local.properties` file in this folder that points to the Android SDK and NDK
8 | ```
9 | ndk.dir=/Users/{username}/Library/Android/sdk/ndk-bundle
10 | sdk.dir=/Users/{username}/Library/Android/sdk
11 | ```
12 | 3. Delete the `maven` folder
13 | 4. Run `./gradlew installArchives`
14 | 5. Verify that latest set of generated files is in the maven folder with the correct version number
15 |
--------------------------------------------------------------------------------
/translate-text/android/README.md:
--------------------------------------------------------------------------------
1 | README
2 | ======
3 |
4 | If you want to publish the lib as a maven dependency, follow these steps before publishing a new version to npm:
5 |
6 | 1. Be sure to have the Android [SDK](https://developer.android.com/studio/index.html) and [NDK](https://developer.android.com/ndk/guides/index.html) installed
7 | 2. Be sure to have a `local.properties` file in this folder that points to the Android SDK and NDK
8 | ```
9 | ndk.dir=/Users/{username}/Library/Android/sdk/ndk-bundle
10 | sdk.dir=/Users/{username}/Library/Android/sdk
11 | ```
12 | 3. Delete the `maven` folder
13 | 4. Run `./gradlew installArchives`
14 | 5. Verify that latest set of generated files is in the maven folder with the correct version number
15 |
--------------------------------------------------------------------------------
/identify-languages/android/README.md:
--------------------------------------------------------------------------------
1 | README
2 | ======
3 |
4 | If you want to publish the lib as a maven dependency, follow these steps before publishing a new version to npm:
5 |
6 | 1. Be sure to have the Android [SDK](https://developer.android.com/studio/index.html) and [NDK](https://developer.android.com/ndk/guides/index.html) installed
7 | 2. Be sure to have a `local.properties` file in this folder that points to the Android SDK and NDK
8 | ```
9 | ndk.dir=/Users/{username}/Library/Android/sdk/ndk-bundle
10 | sdk.dir=/Users/{username}/Library/Android/sdk
11 | ```
12 | 3. Delete the `maven` folder
13 | 4. Run `./gradlew installArchives`
14 | 5. Verify that latest set of generated files is in the maven folder with the correct version number
15 |
--------------------------------------------------------------------------------
/example/src/core/LabelTile.tsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import {View, Text, StyleSheet} from 'react-native';
3 |
4 | interface LabelProps {
5 | children: React.ReactNode;
6 | }
7 |
8 | const LabelTile = ({children}: LabelProps) => {
9 | return (
10 |
11 | {children}
12 |
13 | );
14 | };
15 |
16 | const styles = StyleSheet.create({
17 | label: {
18 | backgroundColor: 'white',
19 | shadowColor: '#000',
20 | shadowOffset: {width: 0, height: 1},
21 | shadowOpacity: 0.2,
22 | shadowRadius: 1,
23 | elevation: 1,
24 | padding: 10,
25 | borderRadius: 5,
26 | marginBottom: 8,
27 | marginHorizontal: 10,
28 | alignItems: 'center',
29 | },
30 | });
31 |
32 | export default LabelTile;
33 |
--------------------------------------------------------------------------------
/identify-languages/example/ios/example/Images.xcassets/AppIcon.appiconset/Contents.json:
--------------------------------------------------------------------------------
1 | {
2 | "images" : [
3 | {
4 | "idiom" : "iphone",
5 | "size" : "29x29",
6 | "scale" : "2x"
7 | },
8 | {
9 | "idiom" : "iphone",
10 | "size" : "29x29",
11 | "scale" : "3x"
12 | },
13 | {
14 | "idiom" : "iphone",
15 | "size" : "40x40",
16 | "scale" : "2x"
17 | },
18 | {
19 | "idiom" : "iphone",
20 | "size" : "40x40",
21 | "scale" : "3x"
22 | },
23 | {
24 | "idiom" : "iphone",
25 | "size" : "60x60",
26 | "scale" : "2x"
27 | },
28 | {
29 | "idiom" : "iphone",
30 | "size" : "60x60",
31 | "scale" : "3x"
32 | }
33 | ],
34 | "info" : {
35 | "version" : 1,
36 | "author" : "xcode"
37 | }
38 | }
--------------------------------------------------------------------------------
/translate-text/example/ios/example/Images.xcassets/AppIcon.appiconset/Contents.json:
--------------------------------------------------------------------------------
1 | {
2 | "images" : [
3 | {
4 | "idiom" : "iphone",
5 | "size" : "29x29",
6 | "scale" : "2x"
7 | },
8 | {
9 | "idiom" : "iphone",
10 | "size" : "29x29",
11 | "scale" : "3x"
12 | },
13 | {
14 | "idiom" : "iphone",
15 | "size" : "40x40",
16 | "scale" : "2x"
17 | },
18 | {
19 | "idiom" : "iphone",
20 | "size" : "40x40",
21 | "scale" : "3x"
22 | },
23 | {
24 | "idiom" : "iphone",
25 | "size" : "60x60",
26 | "scale" : "2x"
27 | },
28 | {
29 | "idiom" : "iphone",
30 | "size" : "60x60",
31 | "scale" : "3x"
32 | }
33 | ],
34 | "info" : {
35 | "version" : 1,
36 | "author" : "xcode"
37 | }
38 | }
--------------------------------------------------------------------------------
/example/android/app/src/release/java/com/rnmlkitexample/ReactNativeFlipper.java:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright (c) Meta Platforms, Inc. and affiliates.
3 | *
4 | * This source code is licensed under the MIT license found in the LICENSE file in the root
5 | * directory of this source tree.
6 | */
7 | package com.rnmlkitexample;
8 |
9 | import android.content.Context;
10 | import com.facebook.react.ReactInstanceManager;
11 |
12 | /**
13 | * Class responsible of loading Flipper inside your React Native application. This is the release
14 | * flavor of it so it's empty as we don't want to load Flipper.
15 | */
16 | public class ReactNativeFlipper {
17 | public static void initializeFlipper(Context context, ReactInstanceManager reactInstanceManager) {
18 | // Do nothing as we don't want to initialize Flipper on Release.
19 | }
20 | }
21 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # React Native ML Kit
2 |
3 | React Native On-Device Machine Learning w/ Google ML Kit
4 |
5 | ## Supported Modules
6 |
7 | | Module | Android | iOS |
8 | | ------------------------------------------ | :-----: | :-: |
9 | | [Image Labeling](./image-labeling) | ✅ | ✅ |
10 | | [Identify Languages](./identify-languages) | ✅ | ✅ |
11 | | [Face Detection](./face-detection) | ✅ | ✅ |
12 | | [Text Recognition](./text-recognition) | ✅ | ✅ |
13 | | [Barcode Scanning](./barcode-scanning) | ✅ | ✅ |
14 | | [Translate Text](./translate-text) | ✅ | ❌ |
15 | | Object Detection and Tracking | ❌ | ❌ |
16 | | Digital Ink Recognition | ❌ | ❌ |
17 | | Smart Replies | ❌ | ❌ |
18 |
--------------------------------------------------------------------------------
/image-labeling/README.md:
--------------------------------------------------------------------------------
1 | # @react-native-ml-kit/image-labeling
2 |
3 | React Native On-Device Image Labeling w/ Google ML Kit
4 |
5 | ## Getting started
6 |
7 | `npm install @react-native-ml-kit/image-labeling --save`
8 |
9 | ### Linking
10 |
11 | #### React Native > 0.59
12 |
13 | [CLI autolink feature](https://github.com/react-native-community/cli/blob/master/docs/autolinking.md) links the module while building the app.
14 |
15 | #### React Native <= 0.59
16 |
17 | `react-native link @react-native-ml-kit/image-labeling`
18 |
19 | ### Installing Pods
20 |
21 | On iOS, use CocoaPods to add the native RNMLKitImageLabeling to your project:
22 |
23 | `npx pod-install`
24 |
25 | ## Usage
26 |
27 | ```javascript
28 | import ImageLabeling from '@react-native-ml-kit/image-labeling';
29 |
30 | const labels = await ImageLabeling.label(imageURL);
31 | ```
32 |
--------------------------------------------------------------------------------
/example/ios/RNMLKitExampleTests/Info.plist:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | CFBundleDevelopmentRegion
6 | en
7 | CFBundleExecutable
8 | $(EXECUTABLE_NAME)
9 | CFBundleIdentifier
10 | $(PRODUCT_BUNDLE_IDENTIFIER)
11 | CFBundleInfoDictionaryVersion
12 | 6.0
13 | CFBundleName
14 | $(PRODUCT_NAME)
15 | CFBundlePackageType
16 | BNDL
17 | CFBundleShortVersionString
18 | 1.0
19 | CFBundleSignature
20 | ????
21 | CFBundleVersion
22 | 1
23 |
24 |
25 |
--------------------------------------------------------------------------------
/barcode-scanning/android/.project:
--------------------------------------------------------------------------------
1 |
2 |
3 | android
4 | Project android created by Buildship.
5 |
6 |
7 |
8 |
9 | org.eclipse.buildship.core.gradleprojectbuilder
10 |
11 |
12 |
13 |
14 |
15 | org.eclipse.buildship.core.gradleprojectnature
16 |
17 |
18 |
19 | 1647315623426
20 |
21 | 30
22 |
23 | org.eclipse.core.resources.regexFilterMatcher
24 | node_modules|.git|__CREATED_BY_JAVA_LANGUAGE_SERVER__
25 |
26 |
27 |
28 |
29 |
--------------------------------------------------------------------------------
/face-detection/README.md:
--------------------------------------------------------------------------------
1 | # @react-native-ml-kit/face-detection
2 |
3 | React Native On-Device Face Detection w/ Google ML Kit
4 |
5 | ## Getting started
6 |
7 | `npm install @react-native-ml-kit/face-detection --save`
8 |
9 | ### Linking
10 |
11 | #### React Native > 0.59
12 |
13 | [CLI autolink feature](https://github.com/react-native-community/cli/blob/master/docs/autolinking.md) links the module while building the app.
14 |
15 | #### React Native <= 0.59
16 |
17 | `react-native link @react-native-ml-kit/face-detection`
18 |
19 | ### Installing Pods
20 |
21 | On iOS, use CocoaPods to add the native RNMLKitFaceDetection to your project:
22 |
23 | `npx pod-install`
24 |
25 | ## Usage
26 |
27 | ```javascript
28 | import FaceDetection from '@react-native-ml-kit/face-detection';
29 |
30 | const faces = FaceDetection.detect(imageURL, { landmarkMode: 'all' });
31 | ```
32 |
--------------------------------------------------------------------------------
/identify-languages/example/ios/exampleTests/Info.plist:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | CFBundleDevelopmentRegion
6 | en
7 | CFBundleExecutable
8 | $(EXECUTABLE_NAME)
9 | CFBundleIdentifier
10 | $(PRODUCT_BUNDLE_IDENTIFIER)
11 | CFBundleInfoDictionaryVersion
12 | 6.0
13 | CFBundleName
14 | $(PRODUCT_NAME)
15 | CFBundlePackageType
16 | BNDL
17 | CFBundleShortVersionString
18 | 1.0
19 | CFBundleSignature
20 | ????
21 | CFBundleVersion
22 | 1
23 |
24 |
25 |
--------------------------------------------------------------------------------
/translate-text/example/ios/exampleTests/Info.plist:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | CFBundleDevelopmentRegion
6 | en
7 | CFBundleExecutable
8 | $(EXECUTABLE_NAME)
9 | CFBundleIdentifier
10 | $(PRODUCT_BUNDLE_IDENTIFIER)
11 | CFBundleInfoDictionaryVersion
12 | 6.0
13 | CFBundleName
14 | $(PRODUCT_NAME)
15 | CFBundlePackageType
16 | BNDL
17 | CFBundleShortVersionString
18 | 1.0
19 | CFBundleSignature
20 | ????
21 | CFBundleVersion
22 | 1
23 |
24 |
25 |
--------------------------------------------------------------------------------
/example/src/core/ListTile.tsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import {StyleSheet, Text, TouchableHighlight} from 'react-native';
3 |
4 | interface ListTileProps {
5 | title: string;
6 | onPress: () => void;
7 | }
8 |
9 | const ListTile = ({title, onPress}: ListTileProps) => {
10 | return (
11 |
15 | {title}
16 |
17 | );
18 | };
19 |
20 | const styles = StyleSheet.create({
21 | listTile: {
22 | paddingVertical: 16,
23 | paddingHorizontal: 24,
24 | borderBottomWidth: 1,
25 | borderBottomColor: '#ddd',
26 | backgroundColor: 'white',
27 | },
28 | title: {
29 | fontSize: 16,
30 | fontWeight: 'bold',
31 | color: '#333',
32 | },
33 | });
34 |
35 | export default ListTile;
36 |
--------------------------------------------------------------------------------
/translate-text/example/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "translate-text-example",
3 | "version": "0.0.1",
4 | "private": true,
5 | "scripts": {
6 | "android": "react-native run-android",
7 | "ios": "react-native run-ios",
8 | "start": "react-native start",
9 | "test": "jest",
10 | "lint": "eslint ."
11 | },
12 | "dependencies": {
13 | "@react-native-ml-kit/translate-text": "link:../",
14 | "react": "17.0.2",
15 | "react-native": "0.66.1"
16 | },
17 | "devDependencies": {
18 | "@babel/core": "^7.12.9",
19 | "@babel/runtime": "^7.12.5",
20 | "@react-native-community/eslint-config": "^2.0.0",
21 | "babel-jest": "^26.6.3",
22 | "eslint": "7.14.0",
23 | "jest": "^26.6.3",
24 | "metro-react-native-babel-preset": "^0.66.2",
25 | "react-test-renderer": "17.0.2"
26 | },
27 | "jest": {
28 | "preset": "react-native"
29 | }
30 | }
31 |
--------------------------------------------------------------------------------
/identify-languages/example/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "identify-languages-example",
3 | "version": "0.0.1",
4 | "private": true,
5 | "scripts": {
6 | "android": "react-native run-android",
7 | "ios": "react-native run-ios",
8 | "start": "react-native start",
9 | "test": "jest",
10 | "lint": "eslint ."
11 | },
12 | "dependencies": {
13 | "@react-native-ml-kit/identify-languages": "link:../",
14 | "react": "17.0.2",
15 | "react-native": "0.66.1"
16 | },
17 | "devDependencies": {
18 | "@babel/core": "^7.12.9",
19 | "@babel/runtime": "^7.12.5",
20 | "@react-native-community/eslint-config": "^2.0.0",
21 | "babel-jest": "^26.6.3",
22 | "eslint": "7.14.0",
23 | "jest": "^26.6.3",
24 | "metro-react-native-babel-preset": "^0.66.2",
25 | "react-test-renderer": "17.0.2"
26 | },
27 | "jest": {
28 | "preset": "react-native"
29 | }
30 | }
31 |
--------------------------------------------------------------------------------
/example/ios/RNMLKitExample/AppDelegate.mm:
--------------------------------------------------------------------------------
1 | #import "AppDelegate.h"
2 |
3 | #import
4 |
5 | @implementation AppDelegate
6 |
7 | - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
8 | {
9 | self.moduleName = @"RNMLKitExample";
10 | // You can add your custom initial props in the dictionary below.
11 | // They will be passed down to the ViewController used by React Native.
12 | self.initialProps = @{};
13 |
14 | return [super application:application didFinishLaunchingWithOptions:launchOptions];
15 | }
16 |
17 | - (NSURL *)sourceURLForBridge:(RCTBridge *)bridge
18 | {
19 | #if DEBUG
20 | return [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@".expo/.virtual-metro-entry"];
21 | #else
22 | return [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];
23 | #endif
24 | }
25 |
26 | @end
27 |
--------------------------------------------------------------------------------
/example/src/core/OptionSwitch.tsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import {StyleSheet, Switch, View, Text} from 'react-native';
3 |
4 | interface OptionSwitchProps {
5 | label: string;
6 | value: boolean;
7 | onChange: (value: boolean) => void;
8 | }
9 |
10 | const OptionSwitch = ({value, onChange, label}: OptionSwitchProps) => {
11 | return (
12 |
13 |
18 | {label}
19 |
20 | );
21 | };
22 |
23 | const styles = StyleSheet.create({
24 | switchContainer: {
25 | flexDirection: 'row',
26 | alignItems: 'center',
27 | marginTop: 10,
28 | },
29 | switchLabel: {
30 | color: '#333',
31 | marginLeft: 15,
32 | },
33 | });
34 |
35 | export default OptionSwitch;
36 |
--------------------------------------------------------------------------------
/face-detection/android/src/main/java/com/rnmlkit/facedetection/FaceDetectionPackage.java:
--------------------------------------------------------------------------------
1 | // FaceDetectionPackage.java
2 |
3 | package com.rnmlkit.facedetection;
4 |
5 | import java.util.Arrays;
6 | import java.util.Collections;
7 | import java.util.List;
8 |
9 | import com.facebook.react.ReactPackage;
10 | import com.facebook.react.bridge.NativeModule;
11 | import com.facebook.react.bridge.ReactApplicationContext;
12 | import com.facebook.react.uimanager.ViewManager;
13 |
14 | public class FaceDetectionPackage implements ReactPackage {
15 | @Override
16 | public List createNativeModules(ReactApplicationContext reactContext) {
17 | return Arrays.asList(new FaceDetectionModule(reactContext));
18 | }
19 |
20 | @Override
21 | public List createViewManagers(ReactApplicationContext reactContext) {
22 | return Collections.emptyList();
23 | }
24 | }
25 |
--------------------------------------------------------------------------------
/image-labeling/android/src/main/java/com/rnmlkit/imagelabeling/ImageLabelingPackage.java:
--------------------------------------------------------------------------------
1 | // ImageLabelingPackage.java
2 |
3 | package com.rnmlkit.imagelabeling;
4 |
5 | import java.util.Arrays;
6 | import java.util.Collections;
7 | import java.util.List;
8 |
9 | import com.facebook.react.ReactPackage;
10 | import com.facebook.react.bridge.NativeModule;
11 | import com.facebook.react.bridge.ReactApplicationContext;
12 | import com.facebook.react.uimanager.ViewManager;
13 |
14 | public class ImageLabelingPackage implements ReactPackage {
15 | @Override
16 | public List createNativeModules(ReactApplicationContext reactContext) {
17 | return Arrays.asList(new ImageLabelingModule(reactContext));
18 | }
19 |
20 | @Override
21 | public List createViewManagers(ReactApplicationContext reactContext) {
22 | return Collections.emptyList();
23 | }
24 | }
25 |
--------------------------------------------------------------------------------
/translate-text/android/src/main/java/com/rnmlkit/translatetext/TranslateTextPackage.java:
--------------------------------------------------------------------------------
1 | // TranslateTextPackage.java
2 |
3 | package com.rnmlkit.translatetext;
4 |
5 | import java.util.Arrays;
6 | import java.util.Collections;
7 | import java.util.List;
8 |
9 | import com.facebook.react.ReactPackage;
10 | import com.facebook.react.bridge.NativeModule;
11 | import com.facebook.react.bridge.ReactApplicationContext;
12 | import com.facebook.react.uimanager.ViewManager;
13 |
14 | public class TranslateTextPackage implements ReactPackage {
15 | @Override
16 | public List createNativeModules(ReactApplicationContext reactContext) {
17 | return Arrays.asList(new TranslateTextModule(reactContext));
18 | }
19 |
20 | @Override
21 | public List createViewManagers(ReactApplicationContext reactContext) {
22 | return Collections.emptyList();
23 | }
24 | }
25 |
--------------------------------------------------------------------------------
/barcode-scanning/android/src/main/java/com/rnmlkit/barcodescanning/BarcodeScanningPackage.java:
--------------------------------------------------------------------------------
1 | // BarcodeScanning.java
2 |
3 | package com.rnmlkit.barcodescanning;
4 |
5 | import java.util.Arrays;
6 | import java.util.Collections;
7 | import java.util.List;
8 |
9 | import com.facebook.react.ReactPackage;
10 | import com.facebook.react.bridge.NativeModule;
11 | import com.facebook.react.bridge.ReactApplicationContext;
12 | import com.facebook.react.uimanager.ViewManager;
13 |
14 | public class BarcodeScanningPackage implements ReactPackage {
15 | @Override
16 | public List createNativeModules(ReactApplicationContext reactContext) {
17 | return Arrays.asList(new BarcodeScanningModule(reactContext));
18 | }
19 |
20 | @Override
21 | public List createViewManagers(ReactApplicationContext reactContext) {
22 | return Collections.emptyList();
23 | }
24 | }
25 |
--------------------------------------------------------------------------------
/text-recognition/android/src/main/java/com/rnmlkit/textrecognition/TextRecognitionPackage.java:
--------------------------------------------------------------------------------
1 | // TextRecognitionPackage.java
2 |
3 | package com.rnmlkit.textrecognition;
4 |
5 | import java.util.Arrays;
6 | import java.util.Collections;
7 | import java.util.List;
8 |
9 | import com.facebook.react.ReactPackage;
10 | import com.facebook.react.bridge.NativeModule;
11 | import com.facebook.react.bridge.ReactApplicationContext;
12 | import com.facebook.react.uimanager.ViewManager;
13 |
14 | public class TextRecognitionPackage implements ReactPackage {
15 | @Override
16 | public List createNativeModules(ReactApplicationContext reactContext) {
17 | return Arrays.asList(new TextRecognitionModule(reactContext));
18 | }
19 |
20 | @Override
21 | public List createViewManagers(ReactApplicationContext reactContext) {
22 | return Collections.emptyList();
23 | }
24 | }
25 |
--------------------------------------------------------------------------------
/translate-text/example/ios/Podfile:
--------------------------------------------------------------------------------
1 | require_relative '../node_modules/react-native/scripts/react_native_pods'
2 | require_relative '../node_modules/@react-native-community/cli-platform-ios/native_modules'
3 |
4 | platform :ios, '11.0'
5 |
6 | target 'example' do
7 | config = use_native_modules!
8 |
9 | use_react_native!(
10 | :path => config[:reactNativePath],
11 | # to enable hermes on iOS, change `false` to `true` and then install pods
12 | :hermes_enabled => false
13 | )
14 |
15 | target 'exampleTests' do
16 | inherit! :complete
17 | # Pods for testing
18 | end
19 |
20 | # Enables Flipper.
21 | #
22 | # Note that if you have use_frameworks! enabled, Flipper will not work and
23 | # you should disable the next line.
24 | use_flipper!()
25 |
26 | post_install do |installer|
27 | react_native_post_install(installer)
28 | __apply_Xcode_12_5_M1_post_install_workaround(installer)
29 | end
30 | end
31 |
--------------------------------------------------------------------------------
/identify-languages/android/src/main/java/com/rnmlkit/identifylanguages/IdentifyLanguagesPackage.java:
--------------------------------------------------------------------------------
1 | // IdentifyLanguagesPackage.java
2 |
3 | package com.rnmlkit.identifylanguages;
4 |
5 | import java.util.Arrays;
6 | import java.util.Collections;
7 | import java.util.List;
8 |
9 | import com.facebook.react.ReactPackage;
10 | import com.facebook.react.bridge.NativeModule;
11 | import com.facebook.react.bridge.ReactApplicationContext;
12 | import com.facebook.react.uimanager.ViewManager;
13 |
14 | public class IdentifyLanguagesPackage implements ReactPackage {
15 | @Override
16 | public List createNativeModules(ReactApplicationContext reactContext) {
17 | return Arrays.asList(new IdentifyLanguagesModule(reactContext));
18 | }
19 |
20 | @Override
21 | public List createViewManagers(ReactApplicationContext reactContext) {
22 | return Collections.emptyList();
23 | }
24 | }
25 |
--------------------------------------------------------------------------------
/identify-languages/example/ios/Podfile:
--------------------------------------------------------------------------------
1 | require_relative '../node_modules/react-native/scripts/react_native_pods'
2 | require_relative '../node_modules/@react-native-community/cli-platform-ios/native_modules'
3 |
4 | platform :ios, '11.0'
5 |
6 | target 'example' do
7 | config = use_native_modules!
8 |
9 | use_react_native!(
10 | :path => config[:reactNativePath],
11 | # to enable hermes on iOS, change `false` to `true` and then install pods
12 | :hermes_enabled => false
13 | )
14 |
15 | target 'exampleTests' do
16 | inherit! :complete
17 | # Pods for testing
18 | end
19 |
20 | # Enables Flipper.
21 | #
22 | # Note that if you have use_frameworks! enabled, Flipper will not work and
23 | # you should disable the next line.
24 | use_flipper!()
25 |
26 | post_install do |installer|
27 | react_native_post_install(installer)
28 | __apply_Xcode_12_5_M1_post_install_workaround(installer)
29 | end
30 | end
31 |
--------------------------------------------------------------------------------
/barcode-scanning/README.md:
--------------------------------------------------------------------------------
1 | # @react-native-ml-kit/barcode-scanning
2 |
3 | React Native On-Device Barcode Scanning w/ Google ML Kit
4 |
5 | ## Getting started
6 |
7 | `npm install @react-native-ml-kit/barcode-scanning --save`
8 |
9 | ### Linking
10 |
11 | #### React Native > 0.59
12 |
13 | [CLI autolink feature](https://github.com/react-native-community/cli/blob/master/docs/autolinking.md) links the module while building the app.
14 |
15 | #### React Native <= 0.59
16 |
17 | `react-native link @react-native-ml-kit/barcode-scanning`
18 |
19 | ### Installing Pods
20 |
21 | On iOS, use CocoaPods to add the native RNMLKitBarcodeScanning to your project:
22 |
23 | `npx pod-install`
24 |
25 | ## Usage
26 |
27 | ```javascript
28 | import BarcodeScanning from '@react-native-ml-kit/barcode-scanning';
29 |
30 | const barcodes = await BarcodeScanning.scan(imageURL);
31 | for (let barcode of barcodes) {
32 | console.log(barcode.value, barcode.format);
33 | }
34 | ```
35 |
--------------------------------------------------------------------------------
/example/src/core/ChooseImageButton.tsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import {Button} from 'react-native';
3 | import * as ImagePicker from 'expo-image-picker';
4 |
5 | export interface ImageDetails {
6 | path: string;
7 | height: number;
8 | width: number;
9 | }
10 |
11 | interface ChooseImageButtonProps {
12 | onChoose: (image: ImageDetails) => void;
13 | }
14 |
15 | const ChooseImageButton = ({onChoose}: ChooseImageButtonProps) => {
16 | const handlePress = async () => {
17 | const imageResult = await ImagePicker.launchImageLibraryAsync();
18 | if (imageResult.canceled) {
19 | return;
20 | }
21 |
22 | const asset = imageResult.assets![0];
23 | const currentImage = {
24 | path: asset.uri,
25 | width: asset.width,
26 | height: asset.height,
27 | };
28 |
29 | onChoose(currentImage);
30 | };
31 |
32 | return ;
33 | };
34 |
35 | export default ChooseImageButton;
36 |
--------------------------------------------------------------------------------
/face-detection/RNMLKitFaceDetection.podspec:
--------------------------------------------------------------------------------
1 | # RNMLKitFaceDetection.podspec
2 |
3 | require "json"
4 |
5 | package = JSON.parse(File.read(File.join(__dir__, "package.json")))
6 |
7 | Pod::Spec.new do |s|
8 | s.name = "RNMLKitFaceDetection"
9 | s.version = package["version"]
10 | s.summary = package["description"]
11 | s.homepage = "https://github.com/a7med-mahmoud/react-native-ml-kit"
12 | # brief license entry:
13 | s.license = "MIT"
14 | # optional - use expanded license entry instead:
15 | # s.license = { :type => "MIT", :file => "LICENSE" }
16 | s.authors = { "Ahmed" => "a7med.mahmoud2004@gmail.com" }
17 | s.platforms = { :ios => "15.5" }
18 | s.source = { :git => "https://github.com/a7med-mahmoud/react-native-ml-kit.git", :tag => "#{s.version}" }
19 |
20 | s.source_files = "ios/**/*.{h,c,cc,cpp,m,mm,swift}"
21 | s.requires_arc = true
22 |
23 | s.dependency "React"
24 | s.dependency "GoogleMLKit/FaceDetection", "8.0.0"
25 | end
26 |
27 |
--------------------------------------------------------------------------------
/image-labeling/RNMLKitImageLabeling.podspec:
--------------------------------------------------------------------------------
1 | # RNMLKitImageLabeling.podspec
2 |
3 | require "json"
4 |
5 | package = JSON.parse(File.read(File.join(__dir__, "package.json")))
6 |
7 | Pod::Spec.new do |s|
8 | s.name = "RNMLKitImageLabeling"
9 | s.version = package["version"]
10 | s.summary = package["description"]
11 |
12 | s.homepage = "https://github.com/a7med-mahmoud/react-native-ml-kit"
13 | # brief license entry:
14 | s.license = "MIT"
15 | # optional - use expanded license entry instead:
16 | # s.license = { :type => "MIT", :file => "LICENSE" }
17 | s.authors = { "Ahmed" => "a7med.mahmoud2004@gmail.com" }
18 | s.platforms = { :ios => "15.5" }
19 | s.source = { :git => "https://github.com/a7med-mahmoud/react-native-ml-kit.git", :tag => "#{s.version}" }
20 |
21 | s.source_files = "ios/**/*.{h,c,cc,cpp,m,mm,swift}"
22 | s.requires_arc = true
23 |
24 | s.dependency "React"
25 | s.dependency "GoogleMLKit/ImageLabeling", "8.0.0"
26 | end
27 |
--------------------------------------------------------------------------------
/translate-text/RNMLKitTranslateText.podspec:
--------------------------------------------------------------------------------
1 | # RNMLKitTranslateText.podspec
2 |
3 | require "json"
4 |
5 | package = JSON.parse(File.read(File.join(__dir__, "package.json")))
6 |
7 | Pod::Spec.new do |s|
8 | s.name = "RNMLKitTranslateText"
9 | s.version = package["version"]
10 | s.summary = package["description"]
11 | s.homepage = "https://github.com/a7med-mahmoud/react-native-ml-kit"
12 | # brief license entry:
13 | s.license = "MIT"
14 | # optional - use expanded license entry instead:
15 | # s.license = { :type => "MIT", :file => "LICENSE" }
16 | s.authors = { "Ahmed Mahmoud" => "a7med.mahmoud2004@gmail.com" }
17 | s.platforms = { :ios => "15.5" }
18 | s.source = { :git => "https://github.com/a7med-mahmoud/react-native-ml-kit.git", :tag => "#{s.version}" }
19 |
20 | s.source_files = "ios/**/*.{h,c,cc,cpp,m,mm,swift}"
21 | s.requires_arc = true
22 |
23 | s.dependency "React"
24 | s.dependency "GoogleMLKit/Translate", "8.0.0"
25 | end
26 |
27 |
--------------------------------------------------------------------------------
/barcode-scanning/RNMLKitBarcodeScanning.podspec:
--------------------------------------------------------------------------------
1 | # RNMLKitBarcodeScanning.podspec
2 |
3 | require "json"
4 |
5 | package = JSON.parse(File.read(File.join(__dir__, "package.json")))
6 |
7 | Pod::Spec.new do |s|
8 | s.name = "RNMLKitBarcodeScanning"
9 | s.version = package["version"]
10 | s.summary = package["description"]
11 |
12 | s.homepage = "https://github.com/a7med-mahmoud/react-native-ml-kit"
13 | # brief license entry:
14 | s.license = "MIT"
15 | # optional - use expanded license entry instead:
16 | # s.license = { :type => "MIT", :file => "LICENSE" }
17 | s.authors = { "Ahmed" => "a7med.mahmoud2004@gmail.com" }
18 | s.platforms = { :ios => "15.5" }
19 | s.source = { :git => "https://github.com/a7med-mahmoud/react-native-ml-kit.git", :tag => "#{s.version}" }
20 |
21 | s.source_files = "ios/**/*.{h,c,cc,cpp,m,mm,swift}"
22 | s.requires_arc = true
23 |
24 | s.dependency "React"
25 | s.dependency "GoogleMLKit/BarcodeScanning", "8.0.0"
26 | end
27 |
--------------------------------------------------------------------------------
/translate-text/example/metro.config.js:
--------------------------------------------------------------------------------
1 | // metro.config.js
2 | //
3 | // with multiple workarounds for this issue with symlinks:
4 | // https://github.com/facebook/metro/issues/1
5 | //
6 | // with thanks to @johnryan ()
7 | // for the pointers to multiple workaround solutions here:
8 | // https://github.com/facebook/metro/issues/1#issuecomment-541642857
9 | //
10 | // see also this discussion:
11 | // https://github.com/brodybits/create-react-native-module/issues/232
12 |
13 | const path = require('path');
14 |
15 | module.exports = {
16 | // workaround for an issue with symlinks encountered starting with
17 | // metro@0.55 / React Native 0.61
18 | // (not needed with React Native 0.60 / metro@0.54)
19 | resolver: {
20 | extraNodeModules: new Proxy(
21 | {},
22 | { get: (_, name) => path.resolve('.', 'node_modules', name) },
23 | ),
24 | },
25 |
26 | // quick workaround for another issue with symlinks
27 | watchFolders: [path.resolve('.'), path.resolve('..')],
28 | };
29 |
--------------------------------------------------------------------------------
/identify-languages/example/metro.config.js:
--------------------------------------------------------------------------------
1 | // metro.config.js
2 | //
3 | // with multiple workarounds for this issue with symlinks:
4 | // https://github.com/facebook/metro/issues/1
5 | //
6 | // with thanks to @johnryan ()
7 | // for the pointers to multiple workaround solutions here:
8 | // https://github.com/facebook/metro/issues/1#issuecomment-541642857
9 | //
10 | // see also this discussion:
11 | // https://github.com/brodybits/create-react-native-module/issues/232
12 |
13 | const path = require('path');
14 |
15 | module.exports = {
16 | // workaround for an issue with symlinks encountered starting with
17 | // metro@0.55 / React Native 0.61
18 | // (not needed with React Native 0.60 / metro@0.54)
19 | resolver: {
20 | extraNodeModules: new Proxy(
21 | {},
22 | { get: (_, name) => path.resolve('.', 'node_modules', name) },
23 | ),
24 | },
25 |
26 | // quick workaround for another issue with symlinks
27 | watchFolders: [path.resolve('.'), path.resolve('..')],
28 | };
29 |
--------------------------------------------------------------------------------
/identify-languages/RNMLKitIdentifyLanguages.podspec:
--------------------------------------------------------------------------------
1 | # RNMLKitIdentifyLanguages.podspec
2 |
3 | require "json"
4 |
5 | package = JSON.parse(File.read(File.join(__dir__, "package.json")))
6 |
7 | Pod::Spec.new do |s|
8 | s.name = "RNMLKitIdentifyLanguages"
9 | s.version = package["version"]
10 | s.summary = package["description"]
11 | s.homepage = "https://github.com/a7med-mahmoud/react-native-ml-kit"
12 | # brief license entry:
13 | s.license = "MIT"
14 | # optional - use expanded license entry instead:
15 | # s.license = { :type => "MIT", :file => "LICENSE" }
16 | s.authors = { "Ahmed Mahmoud" => "a7med.mahmoud2004@gmail.com" }
17 | s.platforms = { :ios => "15.5" }
18 | s.source = { :git => "https://github.com/a7med-mahmoud/RNMLKitIdentifyLanguages.git", :tag => "#{s.version}" }
19 |
20 | s.source_files = "ios/**/*.{h,c,cc,cpp,m,mm,swift}"
21 | s.requires_arc = true
22 |
23 | s.dependency "React"
24 | s.dependency "GoogleMLKit/LanguageID", "8.0.0"
25 | end
26 |
27 |
--------------------------------------------------------------------------------
/image-labeling/index.ts:
--------------------------------------------------------------------------------
1 | import { NativeModules, Platform } from 'react-native';
2 |
3 | export interface Label {
4 | text: string;
5 | confidence: number;
6 | index: number;
7 | }
8 |
9 | interface IImageLabeling {
10 | /**
11 | * Label an image
12 | *
13 | * @param imageURL The URL/Path of the image to label
14 | * @returns Array of expected labels for the image
15 | */
16 | label: (imageURL: string) => Promise