--------------------------------------------------------------------------------
/example/.bundle/config:
--------------------------------------------------------------------------------
1 | BUNDLE_PATH: "vendor/bundle"
2 | BUNDLE_FORCE_RUBY_PLATFORM: 1
3 |
--------------------------------------------------------------------------------
/example/.watchmanconfig:
--------------------------------------------------------------------------------
1 | {}
2 |
--------------------------------------------------------------------------------
/example/Gemfile:
--------------------------------------------------------------------------------
1 | source 'https://rubygems.org'
2 |
3 | # You may use http://rbenv.org/ or https://rvm.io/ to install and use this version
4 | ruby ">= 2.6.10"
5 |
6 | gem 'cocoapods', '~> 1.13'
7 | gem 'activesupport', '>= 6.1.7.3', '< 7.1.0'
8 |
--------------------------------------------------------------------------------
/example/README.md:
--------------------------------------------------------------------------------
1 | This is a new [**React Native**](https://reactnative.dev) project, bootstrapped using [`@react-native-community/cli`](https://github.com/react-native-community/cli).
2 |
3 | # Getting Started
4 |
5 | Ensure that you have access to _Camera Kit API token_ and _Lens Group ID_ to put in your application or run the provided _example_ application. Refer to [this guide](https://docs.snap.com/camera-kit/getting-started/setting-up-accounts) for Camera Kit account setup.
6 |
7 | Also, make sure you have completed the [React Native - Environment Setup](https://reactnative.dev/docs/environment-setup) instructions till "Creating a new application" step, before proceeding.
8 |
9 | ## Step 1: Enter Camera Kit API token and group ID
10 |
11 | 1. Open `App.tsx` in and enter value for `apiToken` with the one you get from Camera Kit Developer portal.
12 | 2. Open `Lenses.tsx` and enter value for `groupId` from which you want to fetch lenses. [Optional] Enter value for `launchDataLensId` for the Lens which has launch data associated with it or remove all the relevant code that uses this param.
13 | 3. [_Optional_] This example is using version 1.39.0 of Camera Kit Mobile SDK for Android and latest version on iOS. If you want to use the [latest version](https://docs.snap.com/camera-kit/integrate-sdk/mobile/changelog-mobile#latest-version) of Camera Kit Mobile SDK on Android then modify `cameraKitVersion` variable in [build.gradle](../android/build.gradle) file. Please refer to [Lens Studio Compatibility](https://docs.snap.com/camera-kit/ar-content/lens-studio-compatibility) guide for selecting the appropriate version that work with your Lenses.
14 |
15 | ## Step 2: Start the Metro Server
16 |
17 | You will need to start **Metro**, the JavaScript _bundler_ that ships _with_ React Native.
18 |
19 | To start Metro, run the following command from the _root_ of your React Native project:
20 |
21 | ```bash
22 | yarn start
23 | ```
24 |
25 | ## Step 3: Start your Application
26 |
27 | Let Metro Bundler run in its _own_ terminal. Open a _new_ terminal from the _root_ of your React Native project. Run the following command to start your _Android_ or _iOS_ app:
28 |
29 | ### For Android
30 |
31 | ```bash
32 | yarn android
33 | ```
34 |
35 | ### For iOS
36 |
37 | ```bash
38 | yarn ios
39 | ```
40 |
41 | If everything is set up _correctly_, you should see your new app running in your _Android Emulator_ or _iOS Simulator_ shortly provided you have set up your emulator/simulator correctly.
42 |
43 | This is one way to run your app — you can also run it directly from within Android Studio and Xcode respectively.
44 |
45 | ## Step 4: Modifying your App
46 |
47 | Now that you have successfully run the app, let's modify it.
48 |
49 | 1. Open `App.tsx` in your text editor of choice and edit some lines.
50 | 2. For **Android**: Press the R key twice or select **"Reload"** from the **Developer Menu** (Ctrl + M (on Window and Linux) or Cmd ⌘ + M (on macOS)) to see your changes!
51 |
52 | For **iOS**: Hit Cmd ⌘ + R in your iOS Simulator to reload the app and see your changes!
53 |
54 | ## Congratulations! :tada:
55 |
56 | You've successfully run and modified your React Native App. :partying_face:
57 |
58 | ### Now what?
59 |
60 | - If you want to add this new React Native code to an existing application, check out the [Integration guide](https://reactnative.dev/docs/integration-with-existing-apps).
61 | - If you're curious to learn more about React Native, check out the [Introduction to React Native](https://reactnative.dev/docs/getting-started).
62 |
--------------------------------------------------------------------------------
/example/android/app/build.gradle:
--------------------------------------------------------------------------------
1 | apply plugin: "com.android.application"
2 | apply plugin: "com.facebook.react"
3 |
4 | /**
5 | * This is the configuration block to customize your React Native Android app.
6 | * By default you don't need to apply any configuration, just uncomment the lines you need.
7 | */
8 | react {
9 | /* Folders */
10 | // The root of your project, i.e. where "package.json" lives. Default is '..'
11 | // root = file("../")
12 | // The folder where the react-native NPM package is. Default is ../node_modules/react-native
13 | // reactNativeDir = file("../node_modules/react-native")
14 | // The folder where the react-native Codegen package is. Default is ../node_modules/@react-native/codegen
15 | // codegenDir = file("../node_modules/@react-native/codegen")
16 | // The cli.js file which is the React Native CLI entrypoint. Default is ../node_modules/react-native/cli.js
17 | // cliFile = file("../node_modules/react-native/cli.js")
18 |
19 | /* Variants */
20 | // The list of variants to that are debuggable. For those we're going to
21 | // skip the bundling of the JS bundle and the assets. By default is just 'debug'.
22 | // If you add flavors like lite, prod, etc. you'll have to list your debuggableVariants.
23 | // debuggableVariants = ["liteDebug", "prodDebug"]
24 |
25 | /* Bundling */
26 | // A list containing the node command and its flags. Default is just 'node'.
27 | // nodeExecutableAndArgs = ["node"]
28 | //
29 | // The command to run when bundling. By default is 'bundle'
30 | // bundleCommand = "ram-bundle"
31 | //
32 | // The path to the CLI configuration file. Default is empty.
33 | // bundleConfig = file(../rn-cli.config.js)
34 | //
35 | // The name of the generated asset file containing your JS bundle
36 | // bundleAssetName = "MyApplication.android.bundle"
37 | //
38 | // The entry file for bundle generation. Default is 'index.android.js' or 'index.js'
39 | // entryFile = file("../js/MyApplication.android.js")
40 | //
41 | // A list of extra flags to pass to the 'bundle' commands.
42 | // See https://github.com/react-native-community/cli/blob/main/docs/commands.md#bundle
43 | // extraPackagerArgs = []
44 |
45 | /* Hermes Commands */
46 | // The hermes compiler command to run. By default it is 'hermesc'
47 | // hermesCommand = "$rootDir/my-custom-hermesc/bin/hermesc"
48 | //
49 | // The list of flags to pass to the Hermes compiler. By default is "-O", "-output-source-map"
50 | // hermesFlags = ["-O", "-output-source-map"]
51 | }
52 |
53 | /**
54 | * Set this to true to Run Proguard on Release builds to minify the Java bytecode.
55 | */
56 | def enableProguardInReleaseBuilds = false
57 |
58 | /**
59 | * The preferred build flavor of JavaScriptCore (JSC)
60 | *
61 | * For example, to use the international variant, you can use:
62 | * `def jscFlavor = 'org.webkit:android-jsc-intl:+'`
63 | *
64 | * The international variant includes ICU i18n library and necessary data
65 | * allowing to use e.g. `Date.toLocaleString` and `String.localeCompare` that
66 | * give correct results when using with locales other than en-US. Note that
67 | * this variant is about 6MiB larger per architecture than default.
68 | */
69 | def jscFlavor = 'org.webkit:android-jsc:+'
70 |
71 | android {
72 | ndkVersion rootProject.ext.ndkVersion
73 |
74 | compileSdkVersion rootProject.ext.compileSdkVersion
75 |
76 | namespace "com.snap.camerakit.reactnative.example"
77 | defaultConfig {
78 | applicationId "com.snap.camerakit.reactnative.example"
79 | minSdkVersion rootProject.ext.minSdkVersion
80 | targetSdkVersion rootProject.ext.targetSdkVersion
81 | versionCode 1
82 | versionName "1.0"
83 | }
84 | signingConfigs {
85 | debug {
86 | storeFile file('debug.keystore')
87 | storePassword 'android'
88 | keyAlias 'androiddebugkey'
89 | keyPassword 'android'
90 | }
91 | }
92 | buildTypes {
93 | debug {
94 | signingConfig signingConfigs.debug
95 | }
96 | release {
97 | // Caution! In production, you need to generate your own keystore file.
98 | // see https://reactnative.dev/docs/signed-apk-android.
99 | signingConfig signingConfigs.debug
100 | minifyEnabled enableProguardInReleaseBuilds
101 | proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro"
102 | }
103 | }
104 | }
105 |
106 | repositories {
107 | google()
108 | mavenCentral()
109 | }
110 |
111 | dependencies {
112 | // The version of react-native is set by the React Native Gradle Plugin
113 | implementation("com.facebook.react:react-android")
114 |
115 | debugImplementation("com.facebook.flipper:flipper:${FLIPPER_VERSION}")
116 | debugImplementation("com.facebook.flipper:flipper-network-plugin:${FLIPPER_VERSION}") {
117 | exclude group:'com.squareup.okhttp3', module:'okhttp'
118 | }
119 |
120 | debugImplementation("com.facebook.flipper:flipper-fresco-plugin:${FLIPPER_VERSION}")
121 | if (hermesEnabled.toBoolean()) {
122 | implementation("com.facebook.react:hermes-android")
123 | } else {
124 | implementation jscFlavor
125 | }
126 | }
127 |
128 | configurations.all {
129 | // This block will apply to all configurations
130 | resolutionStrategy.eachDependency { DependencyResolveDetails details ->
131 | // Check if the module name contains 'kotlin-stdlib'
132 | if (details.requested.name.equals("kotlin-stdlib")) {
133 | // Use 1.7.22 version across all deps
134 | details.useVersion("1.7.22")
135 | }
136 | }
137 | }
138 |
139 | apply from: file("../../node_modules/@react-native-community/cli-platform-android/native_modules.gradle"); applyNativeModulesAppBuildGradle(project)
140 |
--------------------------------------------------------------------------------
/example/android/app/debug.keystore:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/Snapchat/camera-kit-react-native/51e46c0bb43c21bed123744669569fe10d6098ce/example/android/app/debug.keystore
--------------------------------------------------------------------------------
/example/android/app/proguard-rules.pro:
--------------------------------------------------------------------------------
1 | # Add project specific ProGuard rules here.
2 | # By default, the flags in this file are appended to flags specified
3 | # in /usr/local/Cellar/android-sdk/24.3.3/tools/proguard/proguard-android.txt
4 | # You can edit the include path and order by changing the proguardFiles
5 | # directive in build.gradle.
6 | #
7 | # For more details, see
8 | # http://developer.android.com/guide/developing/tools/proguard.html
9 |
10 | # Add any project specific keep options here:
11 |
--------------------------------------------------------------------------------
/example/android/app/src/debug/AndroidManifest.xml:
--------------------------------------------------------------------------------
1 |
2 |
4 |
5 |
6 |
7 |
11 |
12 |
13 |
14 |
--------------------------------------------------------------------------------
/example/android/app/src/debug/java/com/snap/camerakit/reactnative/example/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.snap.camerakit.reactnative.example;
8 |
9 | import android.content.Context;
10 | import com.facebook.flipper.android.AndroidFlipperClient;
11 | import com.facebook.flipper.android.utils.FlipperUtils;
12 | import com.facebook.flipper.core.FlipperClient;
13 | import com.facebook.flipper.plugins.crashreporter.CrashReporterPlugin;
14 | import com.facebook.flipper.plugins.databases.DatabasesFlipperPlugin;
15 | import com.facebook.flipper.plugins.fresco.FrescoFlipperPlugin;
16 | import com.facebook.flipper.plugins.inspector.DescriptorMapping;
17 | import com.facebook.flipper.plugins.inspector.InspectorFlipperPlugin;
18 | import com.facebook.flipper.plugins.network.FlipperOkhttpInterceptor;
19 | import com.facebook.flipper.plugins.network.NetworkFlipperPlugin;
20 | import com.facebook.flipper.plugins.sharedpreferences.SharedPreferencesFlipperPlugin;
21 | import com.facebook.react.ReactInstanceEventListener;
22 | import com.facebook.react.ReactInstanceManager;
23 | import com.facebook.react.bridge.ReactContext;
24 | import com.facebook.react.modules.network.NetworkingModule;
25 | import okhttp3.OkHttpClient;
26 |
27 | /**
28 | * Class responsible of loading Flipper inside your React Native application. This is the debug
29 | * flavor of it. Here you can add your own plugins and customize the Flipper setup.
30 | */
31 | public class ReactNativeFlipper {
32 | public static void initializeFlipper(Context context, ReactInstanceManager reactInstanceManager) {
33 | if (FlipperUtils.shouldEnableFlipper(context)) {
34 | final FlipperClient client = AndroidFlipperClient.getInstance(context);
35 |
36 | client.addPlugin(new InspectorFlipperPlugin(context, DescriptorMapping.withDefaults()));
37 | client.addPlugin(new DatabasesFlipperPlugin(context));
38 | client.addPlugin(new SharedPreferencesFlipperPlugin(context));
39 | client.addPlugin(CrashReporterPlugin.getInstance());
40 |
41 | NetworkFlipperPlugin networkFlipperPlugin = new NetworkFlipperPlugin();
42 | NetworkingModule.setCustomClientBuilder(
43 | new NetworkingModule.CustomClientBuilder() {
44 | @Override
45 | public void apply(OkHttpClient.Builder builder) {
46 | builder.addNetworkInterceptor(new FlipperOkhttpInterceptor(networkFlipperPlugin));
47 | }
48 | });
49 | client.addPlugin(networkFlipperPlugin);
50 | client.start();
51 |
52 | // Fresco Plugin needs to ensure that ImagePipelineFactory is initialized
53 | // Hence we run if after all native modules have been initialized
54 | ReactContext reactContext = reactInstanceManager.getCurrentReactContext();
55 | if (reactContext == null) {
56 | reactInstanceManager.addReactInstanceEventListener(
57 | new ReactInstanceEventListener() {
58 | @Override
59 | public void onReactContextInitialized(ReactContext reactContext) {
60 | reactInstanceManager.removeReactInstanceEventListener(this);
61 | reactContext.runOnNativeModulesQueueThread(
62 | new Runnable() {
63 | @Override
64 | public void run() {
65 | client.addPlugin(new FrescoFlipperPlugin());
66 | }
67 | });
68 | }
69 | });
70 | } else {
71 | client.addPlugin(new FrescoFlipperPlugin());
72 | }
73 | }
74 | }
75 | }
76 |
--------------------------------------------------------------------------------
/example/android/app/src/main/AndroidManifest.xml:
--------------------------------------------------------------------------------
1 |
2 |
3 |
6 |
7 |
8 |
9 |
10 |
11 |
18 |
25 |
26 |
27 |
28 |
29 |
30 |
31 |
32 |
--------------------------------------------------------------------------------
/example/android/app/src/main/java/com/snap/camerakit/reactnative/example/MainActivity.java:
--------------------------------------------------------------------------------
1 | package com.snap.camerakit.reactnative.example;
2 |
3 | import com.facebook.react.ReactActivity;
4 | import com.facebook.react.ReactActivityDelegate;
5 | import com.facebook.react.defaults.DefaultNewArchitectureEntryPoint;
6 | import com.facebook.react.defaults.DefaultReactActivityDelegate;
7 |
8 | public class MainActivity extends ReactActivity {
9 |
10 | /**
11 | * Returns the name of the main component registered from JavaScript. This is used to schedule
12 | * rendering of the component.
13 | */
14 | @Override
15 | protected String getMainComponentName() {
16 | return "CameraKitReactNativeExample";
17 | }
18 |
19 | /**
20 | * Returns the instance of the {@link ReactActivityDelegate}. Here we use a util class {@link
21 | * DefaultReactActivityDelegate} which allows you to easily enable Fabric and Concurrent React
22 | * (aka React 18) with two boolean flags.
23 | */
24 | @Override
25 | protected ReactActivityDelegate createReactActivityDelegate() {
26 | return new DefaultReactActivityDelegate(
27 | this,
28 | getMainComponentName(),
29 | // If you opted-in for the New Architecture, we enable the Fabric Renderer.
30 | DefaultNewArchitectureEntryPoint.getFabricEnabled());
31 | }
32 | }
33 |
--------------------------------------------------------------------------------
/example/android/app/src/main/java/com/snap/camerakit/reactnative/example/MainApplication.java:
--------------------------------------------------------------------------------
1 | package com.snap.camerakit.reactnative.example;
2 |
3 | import android.app.Application;
4 |
5 | import com.facebook.react.PackageList;
6 | import com.facebook.react.ReactApplication;
7 | import com.facebook.react.ReactNativeHost;
8 | import com.facebook.react.ReactPackage;
9 | import com.facebook.react.defaults.DefaultNewArchitectureEntryPoint;
10 | import com.facebook.react.defaults.DefaultReactNativeHost;
11 | import com.facebook.soloader.SoLoader;
12 | import java.util.List;
13 |
14 | public class MainApplication extends Application implements ReactApplication {
15 |
16 | private final ReactNativeHost mReactNativeHost =
17 | new DefaultReactNativeHost(this) {
18 | @Override
19 | public boolean getUseDeveloperSupport() {
20 | return BuildConfig.DEBUG;
21 | }
22 |
23 | @Override
24 | protected List getPackages() {
25 | @SuppressWarnings("UnnecessaryLocalVariable")
26 | List packages = new PackageList(this).getPackages();
27 | // Packages that cannot be autolinked yet can be added manually here, for example:
28 | // packages.add(new MyReactNativePackage());
29 | return packages;
30 | }
31 |
32 | @Override
33 | protected String getJSMainModuleName() {
34 | return "index";
35 | }
36 |
37 | @Override
38 | protected boolean isNewArchEnabled() {
39 | return BuildConfig.IS_NEW_ARCHITECTURE_ENABLED;
40 | }
41 |
42 | @Override
43 | protected Boolean isHermesEnabled() {
44 | return BuildConfig.IS_HERMES_ENABLED;
45 | }
46 | };
47 |
48 | @Override
49 | public ReactNativeHost getReactNativeHost() {
50 | return mReactNativeHost;
51 | }
52 |
53 | @Override
54 | public void onCreate() {
55 | super.onCreate();
56 | SoLoader.init(this, /* native exopackage */ false);
57 | if (BuildConfig.IS_NEW_ARCHITECTURE_ENABLED) {
58 | // If you opted-in for the New Architecture, we load the native entry point for this app.
59 | DefaultNewArchitectureEntryPoint.load();
60 | }
61 | ReactNativeFlipper.initializeFlipper(this, getReactNativeHost().getReactInstanceManager());
62 | }
63 | }
64 |
--------------------------------------------------------------------------------
/example/android/app/src/main/res/drawable/rn_edit_text_material.xml:
--------------------------------------------------------------------------------
1 |
2 |
16 |
21 |
22 |
23 |
32 |
33 |
34 |
35 |
36 |
37 |
--------------------------------------------------------------------------------
/example/android/app/src/main/res/mipmap-hdpi/ic_launcher.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/Snapchat/camera-kit-react-native/51e46c0bb43c21bed123744669569fe10d6098ce/example/android/app/src/main/res/mipmap-hdpi/ic_launcher.png
--------------------------------------------------------------------------------
/example/android/app/src/main/res/mipmap-hdpi/ic_launcher_round.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/Snapchat/camera-kit-react-native/51e46c0bb43c21bed123744669569fe10d6098ce/example/android/app/src/main/res/mipmap-hdpi/ic_launcher_round.png
--------------------------------------------------------------------------------
/example/android/app/src/main/res/mipmap-mdpi/ic_launcher.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/Snapchat/camera-kit-react-native/51e46c0bb43c21bed123744669569fe10d6098ce/example/android/app/src/main/res/mipmap-mdpi/ic_launcher.png
--------------------------------------------------------------------------------
/example/android/app/src/main/res/mipmap-mdpi/ic_launcher_round.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/Snapchat/camera-kit-react-native/51e46c0bb43c21bed123744669569fe10d6098ce/example/android/app/src/main/res/mipmap-mdpi/ic_launcher_round.png
--------------------------------------------------------------------------------
/example/android/app/src/main/res/mipmap-xhdpi/ic_launcher.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/Snapchat/camera-kit-react-native/51e46c0bb43c21bed123744669569fe10d6098ce/example/android/app/src/main/res/mipmap-xhdpi/ic_launcher.png
--------------------------------------------------------------------------------
/example/android/app/src/main/res/mipmap-xhdpi/ic_launcher_round.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/Snapchat/camera-kit-react-native/51e46c0bb43c21bed123744669569fe10d6098ce/example/android/app/src/main/res/mipmap-xhdpi/ic_launcher_round.png
--------------------------------------------------------------------------------
/example/android/app/src/main/res/mipmap-xxhdpi/ic_launcher.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/Snapchat/camera-kit-react-native/51e46c0bb43c21bed123744669569fe10d6098ce/example/android/app/src/main/res/mipmap-xxhdpi/ic_launcher.png
--------------------------------------------------------------------------------
/example/android/app/src/main/res/mipmap-xxhdpi/ic_launcher_round.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/Snapchat/camera-kit-react-native/51e46c0bb43c21bed123744669569fe10d6098ce/example/android/app/src/main/res/mipmap-xxhdpi/ic_launcher_round.png
--------------------------------------------------------------------------------
/example/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/Snapchat/camera-kit-react-native/51e46c0bb43c21bed123744669569fe10d6098ce/example/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher.png
--------------------------------------------------------------------------------
/example/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher_round.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/Snapchat/camera-kit-react-native/51e46c0bb43c21bed123744669569fe10d6098ce/example/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher_round.png
--------------------------------------------------------------------------------
/example/android/app/src/main/res/values/strings.xml:
--------------------------------------------------------------------------------
1 |
2 | CameraKitReactNativeExample
3 |
4 |
--------------------------------------------------------------------------------
/example/android/app/src/main/res/values/styles.xml:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
8 |
9 |
10 |
--------------------------------------------------------------------------------
/example/android/app/src/release/java/com/camerakitreactnativeexample/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.snap.camerakit.reactnative.example;
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 |
--------------------------------------------------------------------------------
/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 = "34.0.0"
6 | minSdkVersion = 21
7 | compileSdkVersion = 34
8 | targetSdkVersion = 34
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 |
--------------------------------------------------------------------------------
/example/android/gradle.properties:
--------------------------------------------------------------------------------
1 | # Project-wide Gradle settings.
2 |
3 | # IDE (e.g. Android Studio) users:
4 | # Gradle settings configured through the IDE *will override*
5 | # any settings specified in this file.
6 |
7 | # For more details on how to configure your build environment visit
8 | # http://www.gradle.org/docs/current/userguide/build_environment.html
9 |
10 | # Specifies the JVM arguments used for the daemon process.
11 | # The setting is particularly useful for tweaking memory settings.
12 | # Default value: -Xmx512m -XX:MaxMetaspaceSize=256m
13 | org.gradle.jvmargs=-Xmx2048m -XX:MaxMetaspaceSize=512m
14 |
15 | # When configured, Gradle will run in incubating parallel mode.
16 | # This option should only be used with decoupled projects. More details, visit
17 | # http://www.gradle.org/docs/current/userguide/multi_project_builds.html#sec:decoupled_projects
18 | # org.gradle.parallel=true
19 |
20 | # AndroidX package structure to make it clearer which packages are bundled with the
21 | # Android operating system, and which are packaged with your app's APK
22 | # https://developer.android.com/topic/libraries/support-library/androidx-rn
23 | android.useAndroidX=true
24 | # Automatically convert third-party libraries to use AndroidX
25 | android.enableJetifier=true
26 |
27 | # Version of flipper SDK to use with React Native
28 | FLIPPER_VERSION=0.182.0
29 |
30 | # Use this property to specify which architecture you want to build.
31 | # You can also override it from the CLI using
32 | # ./gradlew -PreactNativeArchitectures=x86_64
33 | reactNativeArchitectures=armeabi-v7a,arm64-v8a,x86,x86_64
34 |
35 | # Use this property to enable support to the new architecture.
36 | # This will allow you to use TurboModules and the Fabric render in
37 | # your application. You should enable this flag either if you want
38 | # to write custom TurboModules/Fabric components OR use libraries that
39 | # are providing them.
40 | newArchEnabled=false
41 |
42 | # Use this property to enable or disable the Hermes JS engine.
43 | # If set to false, you will be using JSC instead.
44 | hermesEnabled=true
45 |
--------------------------------------------------------------------------------
/example/android/gradle/wrapper/gradle-wrapper.jar:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/Snapchat/camera-kit-react-native/51e46c0bb43c21bed123744669569fe10d6098ce/example/android/gradle/wrapper/gradle-wrapper.jar
--------------------------------------------------------------------------------
/example/android/gradle/wrapper/gradle-wrapper.properties:
--------------------------------------------------------------------------------
1 | distributionBase=GRADLE_USER_HOME
2 | distributionPath=wrapper/dists
3 | distributionUrl=https\://services.gradle.org/distributions/gradle-8.0.1-all.zip
4 | networkTimeout=10000
5 | zipStoreBase=GRADLE_USER_HOME
6 | zipStorePath=wrapper/dists
7 |
--------------------------------------------------------------------------------
/example/android/gradlew.bat:
--------------------------------------------------------------------------------
1 | @rem
2 | @rem Copyright 2015 the original author or authors.
3 | @rem
4 | @rem Licensed under the Apache License, Version 2.0 (the "License");
5 | @rem you may not use this file except in compliance with the License.
6 | @rem You may obtain a copy of the License at
7 | @rem
8 | @rem https://www.apache.org/licenses/LICENSE-2.0
9 | @rem
10 | @rem Unless required by applicable law or agreed to in writing, software
11 | @rem distributed under the License is distributed on an "AS IS" BASIS,
12 | @rem WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13 | @rem See the License for the specific language governing permissions and
14 | @rem limitations under the License.
15 | @rem
16 |
17 | @if "%DEBUG%"=="" @echo off
18 | @rem ##########################################################################
19 | @rem
20 | @rem Gradle startup script for Windows
21 | @rem
22 | @rem ##########################################################################
23 |
24 | @rem Set local scope for the variables with windows NT shell
25 | if "%OS%"=="Windows_NT" setlocal
26 |
27 | set DIRNAME=%~dp0
28 | if "%DIRNAME%"=="" set DIRNAME=.
29 | @rem This is normally unused
30 | set APP_BASE_NAME=%~n0
31 | set APP_HOME=%DIRNAME%
32 |
33 | @rem Resolve any "." and ".." in APP_HOME to make it shorter.
34 | for %%i in ("%APP_HOME%") do set APP_HOME=%%~fi
35 |
36 | @rem Add default JVM options here. You can also use JAVA_OPTS and GRADLE_OPTS to pass JVM options to this script.
37 | set DEFAULT_JVM_OPTS="-Xmx64m" "-Xms64m"
38 |
39 | @rem Find java.exe
40 | if defined JAVA_HOME goto findJavaFromJavaHome
41 |
42 | set JAVA_EXE=java.exe
43 | %JAVA_EXE% -version >NUL 2>&1
44 | if %ERRORLEVEL% equ 0 goto execute
45 |
46 | echo.
47 | echo ERROR: JAVA_HOME is not set and no 'java' command could be found in your PATH.
48 | echo.
49 | echo Please set the JAVA_HOME variable in your environment to match the
50 | echo location of your Java installation.
51 |
52 | goto fail
53 |
54 | :findJavaFromJavaHome
55 | set JAVA_HOME=%JAVA_HOME:"=%
56 | set JAVA_EXE=%JAVA_HOME%/bin/java.exe
57 |
58 | if exist "%JAVA_EXE%" goto execute
59 |
60 | echo.
61 | echo ERROR: JAVA_HOME is set to an invalid directory: %JAVA_HOME%
62 | echo.
63 | echo Please set the JAVA_HOME variable in your environment to match the
64 | echo location of your Java installation.
65 |
66 | goto fail
67 |
68 | :execute
69 | @rem Setup the command line
70 |
71 | set CLASSPATH=%APP_HOME%\gradle\wrapper\gradle-wrapper.jar
72 |
73 |
74 | @rem Execute Gradle
75 | "%JAVA_EXE%" %DEFAULT_JVM_OPTS% %JAVA_OPTS% %GRADLE_OPTS% "-Dorg.gradle.appname=%APP_BASE_NAME%" -classpath "%CLASSPATH%" org.gradle.wrapper.GradleWrapperMain %*
76 |
77 | :end
78 | @rem End local scope for the variables with windows NT shell
79 | if %ERRORLEVEL% equ 0 goto mainEnd
80 |
81 | :fail
82 | rem Set variable GRADLE_EXIT_CONSOLE if you need the _script_ return code instead of
83 | rem the _cmd.exe /c_ return code!
84 | set EXIT_CODE=%ERRORLEVEL%
85 | if %EXIT_CODE% equ 0 set EXIT_CODE=1
86 | if not ""=="%GRADLE_EXIT_CONSOLE%" exit %EXIT_CODE%
87 | exit /b %EXIT_CODE%
88 |
89 | :mainEnd
90 | if "%OS%"=="Windows_NT" endlocal
91 |
92 | :omega
93 |
--------------------------------------------------------------------------------
/example/android/settings.gradle:
--------------------------------------------------------------------------------
1 | rootProject.name = 'CameraKitReactNativeExample'
2 | apply from: file("../node_modules/@react-native-community/cli-platform-android/native_modules.gradle"); applyNativeModulesSettingsGradle(settings)
3 | include ':app'
4 | includeBuild('../node_modules/@react-native/gradle-plugin')
5 |
--------------------------------------------------------------------------------
/example/app.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "CameraKitReactNativeExample",
3 | "displayName": "CameraKitReactNativeExample"
4 | }
5 |
--------------------------------------------------------------------------------
/example/babel.config.js:
--------------------------------------------------------------------------------
1 | const path = require('path');
2 | const pak = require('../package.json');
3 |
4 | module.exports = {
5 | presets: ['module:metro-react-native-babel-preset'],
6 | plugins: [
7 | [
8 | 'module-resolver',
9 | {
10 | extensions: ['.tsx', '.ts', '.js', '.json'],
11 | alias: {
12 | [pak.name]: path.join(__dirname, '..', pak.source),
13 | },
14 | },
15 | ],
16 | ],
17 | };
18 |
--------------------------------------------------------------------------------
/example/index.js:
--------------------------------------------------------------------------------
1 | import { AppRegistry } from 'react-native';
2 | import App from './src/App';
3 | import { name as appName } from './app.json';
4 |
5 | AppRegistry.registerComponent(appName, () => App);
6 |
--------------------------------------------------------------------------------
/example/ios/.xcode.env:
--------------------------------------------------------------------------------
1 | # This `.xcode.env` file is versioned and is used to source the environment
2 | # used when running script phases inside Xcode.
3 | # To customize your local environment, you can create an `.xcode.env.local`
4 | # file that is not versioned.
5 |
6 | # NODE_BINARY variable contains the PATH to the node executable.
7 | #
8 | # Customize the NODE_BINARY variable here.
9 | # For example, to use nvm with brew, add the following line
10 | # . "$(brew --prefix nvm)/nvm.sh" --no-use
11 | export NODE_BINARY=$(command -v node)
12 |
--------------------------------------------------------------------------------
/example/ios/CameraKitReactNativeExample-Bridging-Header.h:
--------------------------------------------------------------------------------
1 | //
2 | // Use this file to import your target's public headers that you would like to expose to Swift.
3 | //
4 |
--------------------------------------------------------------------------------
/example/ios/CameraKitReactNativeExample.xcodeproj/xcshareddata/xcschemes/CameraKitReactNativeExample.xcscheme:
--------------------------------------------------------------------------------
1 |
2 |
5 |
8 |
9 |
15 |
21 |
22 |
23 |
24 |
25 |
30 |
31 |
33 |
39 |
40 |
41 |
42 |
43 |
53 |
55 |
61 |
62 |
63 |
64 |
70 |
72 |
78 |
79 |
80 |
81 |
83 |
84 |
87 |
88 |
89 |
--------------------------------------------------------------------------------
/example/ios/CameraKitReactNativeExample.xcworkspace/contents.xcworkspacedata:
--------------------------------------------------------------------------------
1 |
2 |
4 |
6 |
7 |
9 |
10 |
11 |
--------------------------------------------------------------------------------
/example/ios/CameraKitReactNativeExample.xcworkspace/xcshareddata/IDEWorkspaceChecks.plist:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | IDEDidComputeMac32BitWarning
6 |
7 |
8 |
9 |
--------------------------------------------------------------------------------
/example/ios/CameraKitReactNativeExample.xcworkspace/xcshareddata/WorkspaceSettings.xcsettings:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
--------------------------------------------------------------------------------
/example/ios/CameraKitReactNativeExample/AppDelegate.h:
--------------------------------------------------------------------------------
1 | #import
2 | #import
3 |
4 | @interface AppDelegate : RCTAppDelegate
5 |
6 | @end
7 |
--------------------------------------------------------------------------------
/example/ios/CameraKitReactNativeExample/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 = @"CameraKitReactNativeExample";
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:@"index"];
21 | #else
22 | return [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];
23 | #endif
24 | }
25 |
26 | @end
27 |
--------------------------------------------------------------------------------
/example/ios/CameraKitReactNativeExample/Images.xcassets/AppIcon.appiconset/Contents.json:
--------------------------------------------------------------------------------
1 | {
2 | "images" : [
3 | {
4 | "idiom" : "iphone",
5 | "scale" : "2x",
6 | "size" : "20x20"
7 | },
8 | {
9 | "idiom" : "iphone",
10 | "scale" : "3x",
11 | "size" : "20x20"
12 | },
13 | {
14 | "idiom" : "iphone",
15 | "scale" : "2x",
16 | "size" : "29x29"
17 | },
18 | {
19 | "idiom" : "iphone",
20 | "scale" : "3x",
21 | "size" : "29x29"
22 | },
23 | {
24 | "idiom" : "iphone",
25 | "scale" : "2x",
26 | "size" : "40x40"
27 | },
28 | {
29 | "idiom" : "iphone",
30 | "scale" : "3x",
31 | "size" : "40x40"
32 | },
33 | {
34 | "idiom" : "iphone",
35 | "scale" : "2x",
36 | "size" : "60x60"
37 | },
38 | {
39 | "idiom" : "iphone",
40 | "scale" : "3x",
41 | "size" : "60x60"
42 | },
43 | {
44 | "idiom" : "ios-marketing",
45 | "scale" : "1x",
46 | "size" : "1024x1024"
47 | }
48 | ],
49 | "info" : {
50 | "author" : "xcode",
51 | "version" : 1
52 | }
53 | }
54 |
--------------------------------------------------------------------------------
/example/ios/CameraKitReactNativeExample/Images.xcassets/Contents.json:
--------------------------------------------------------------------------------
1 | {
2 | "info" : {
3 | "version" : 1,
4 | "author" : "xcode"
5 | }
6 | }
7 |
--------------------------------------------------------------------------------
/example/ios/CameraKitReactNativeExample/Info.plist:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | NSCameraUsageDescription
6 | This app uses the camera to show the preview on a screen.
7 | CFBundleDevelopmentRegion
8 | en
9 | CFBundleDisplayName
10 | CameraKitReactNativeExample
11 | CFBundleExecutable
12 | $(EXECUTABLE_NAME)
13 | CFBundleIdentifier
14 | $(PRODUCT_BUNDLE_IDENTIFIER)
15 | CFBundleInfoDictionaryVersion
16 | 6.0
17 | CFBundleName
18 | $(PRODUCT_NAME)
19 | CFBundlePackageType
20 | APPL
21 | CFBundleShortVersionString
22 | $(MARKETING_VERSION)
23 | CFBundleSignature
24 | ????
25 | CFBundleVersion
26 | $(CURRENT_PROJECT_VERSION)
27 | LSRequiresIPhoneOS
28 |
29 | NSAppTransportSecurity
30 |
31 | NSExceptionDomains
32 |
33 | localhost
34 |
35 | NSExceptionAllowsInsecureHTTPLoads
36 |
37 |
38 |
39 |
40 | NSCameraUsageDescription
41 | This app uses the camera to show the preview on a screen.
42 | NSLocationWhenInUseUsageDescription
43 |
44 | UILaunchStoryboardName
45 | LaunchScreen
46 | UIRequiredDeviceCapabilities
47 |
48 | armv7
49 |
50 | UISupportedInterfaceOrientations
51 |
52 | UIInterfaceOrientationPortrait
53 | UIInterfaceOrientationLandscapeLeft
54 | UIInterfaceOrientationLandscapeRight
55 |
56 | UIViewControllerBasedStatusBarAppearance
57 |
58 |
59 |
60 |
--------------------------------------------------------------------------------
/example/ios/CameraKitReactNativeExample/LaunchScreen.storyboard:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
17 |
18 |
19 |
24 |
29 |
30 |
31 |
32 |
33 |
34 |
35 |
36 |
37 |
38 |
39 |
40 |
41 |
42 |
43 |
44 |
45 |
46 |
47 |
48 |
--------------------------------------------------------------------------------
/example/ios/CameraKitReactNativeExample/main.m:
--------------------------------------------------------------------------------
1 | #import
2 |
3 | #import "AppDelegate.h"
4 |
5 | int main(int argc, char *argv[])
6 | {
7 | @autoreleasepool {
8 | return UIApplicationMain(argc, argv, nil, NSStringFromClass([AppDelegate class]));
9 | }
10 | }
11 |
--------------------------------------------------------------------------------
/example/ios/CameraKitReactNativeExampleTests/CameraKitReactNativeExampleTests.m:
--------------------------------------------------------------------------------
1 | #import
2 | #import
3 |
4 | #import
5 | #import
6 |
7 | #define TIMEOUT_SECONDS 600
8 | #define TEXT_TO_LOOK_FOR @"Welcome to React"
9 |
10 | @interface CameraKitReactNativeExampleTests : XCTestCase
11 |
12 | @end
13 |
14 | @implementation CameraKitReactNativeExampleTests
15 |
16 | - (BOOL)findSubviewInView:(UIView *)view matching:(BOOL (^)(UIView *view))test
17 | {
18 | if (test(view)) {
19 | return YES;
20 | }
21 | for (UIView *subview in [view subviews]) {
22 | if ([self findSubviewInView:subview matching:test]) {
23 | return YES;
24 | }
25 | }
26 | return NO;
27 | }
28 |
29 | - (void)testRendersWelcomeScreen
30 | {
31 | UIViewController *vc = [[[RCTSharedApplication() delegate] window] rootViewController];
32 | NSDate *date = [NSDate dateWithTimeIntervalSinceNow:TIMEOUT_SECONDS];
33 | BOOL foundElement = NO;
34 |
35 | __block NSString *redboxError = nil;
36 | #ifdef DEBUG
37 | RCTSetLogFunction(
38 | ^(RCTLogLevel level, RCTLogSource source, NSString *fileName, NSNumber *lineNumber, NSString *message) {
39 | if (level >= RCTLogLevelError) {
40 | redboxError = message;
41 | }
42 | });
43 | #endif
44 |
45 | while ([date timeIntervalSinceNow] > 0 && !foundElement && !redboxError) {
46 | [[NSRunLoop mainRunLoop] runMode:NSDefaultRunLoopMode beforeDate:[NSDate dateWithTimeIntervalSinceNow:0.1]];
47 | [[NSRunLoop mainRunLoop] runMode:NSRunLoopCommonModes beforeDate:[NSDate dateWithTimeIntervalSinceNow:0.1]];
48 |
49 | foundElement = [self findSubviewInView:vc.view
50 | matching:^BOOL(UIView *view) {
51 | if ([view.accessibilityLabel isEqualToString:TEXT_TO_LOOK_FOR]) {
52 | return YES;
53 | }
54 | return NO;
55 | }];
56 | }
57 |
58 | #ifdef DEBUG
59 | RCTSetLogFunction(RCTDefaultLogFunction);
60 | #endif
61 |
62 | XCTAssertNil(redboxError, @"RedBox error: %@", redboxError);
63 | XCTAssertTrue(foundElement, @"Couldn't find element with text '%@' in %d seconds", TEXT_TO_LOOK_FOR, TIMEOUT_SECONDS);
64 | }
65 |
66 | @end
67 |
--------------------------------------------------------------------------------
/example/ios/CameraKitReactNativeExampleTests/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/ios/File.swift:
--------------------------------------------------------------------------------
1 | //
2 | // File.swift
3 | // CameraKitReactNativeExample
4 | //
5 |
6 | import Foundation
7 |
--------------------------------------------------------------------------------
/example/ios/Podfile:
--------------------------------------------------------------------------------
1 | # Resolve react_native_pods.rb with node to allow for hoisting
2 | require Pod::Executable.execute_command('node', ['-p',
3 | 'require.resolve(
4 | "react-native/scripts/react_native_pods.rb",
5 | {paths: [process.argv[1]]},
6 | )', __dir__]).strip
7 |
8 | platform :ios, min_ios_version_supported
9 | prepare_react_native_project!
10 |
11 | # If you are using a `react-native-flipper` your iOS build will fail when `NO_FLIPPER=1` is set.
12 | # because `react-native-flipper` depends on (FlipperKit,...) that will be excluded
13 | #
14 | # To fix this you can also exclude `react-native-flipper` using a `react-native.config.js`
15 | # ```js
16 | # module.exports = {
17 | # dependencies: {
18 | # ...(process.env.NO_FLIPPER ? { 'react-native-flipper': { platforms: { ios: null } } } : {}),
19 | # ```
20 | # flipper_config = ENV['NO_FLIPPER'] == "1" ? FlipperConfiguration.disabled : FlipperConfiguration.enabled
21 |
22 | linkage = ENV['USE_FRAMEWORKS']
23 | if linkage != nil
24 | Pod::UI.puts "Configuring Pod with #{linkage}ally linked Frameworks".green
25 | use_frameworks! :linkage => linkage.to_sym
26 | end
27 |
28 | target 'CameraKitReactNativeExample' do
29 | config = use_native_modules!
30 |
31 | # Flags change depending on the env values.
32 | flags = get_default_flags()
33 |
34 | use_react_native!(
35 | :path => config[:reactNativePath],
36 | # Hermes is now enabled by default. Disable by setting this flag to false.
37 | :hermes_enabled => flags[:hermes_enabled],
38 | :fabric_enabled => flags[:fabric_enabled],
39 | # Enables Flipper.
40 | #
41 | # Note that if you have use_frameworks! enabled, Flipper will not work and
42 | # you should disable the next line.
43 | # :flipper_configuration => flipper_config,
44 | # An absolute path to your application root.
45 | :app_path => "#{Pod::Config.instance.installation_root}/.."
46 | )
47 |
48 | target 'CameraKitReactNativeExampleTests' do
49 | inherit! :complete
50 | # Pods for testing
51 | end
52 |
53 | post_install do |installer|
54 | # https://github.com/facebook/react-native/blob/main/packages/react-native/scripts/react_native_pods.rb#L197-L202
55 | react_native_post_install(
56 | installer,
57 | config[:reactNativePath],
58 | :mac_catalyst_enabled => false
59 | )
60 | __apply_Xcode_12_5_M1_post_install_workaround(installer)
61 | end
62 | end
63 |
--------------------------------------------------------------------------------
/example/jest.config.js:
--------------------------------------------------------------------------------
1 | module.exports = {
2 | preset: 'react-native',
3 | };
4 |
--------------------------------------------------------------------------------
/example/metro.config.js:
--------------------------------------------------------------------------------
1 | const { getDefaultConfig, mergeConfig } = require('@react-native/metro-config');
2 | const path = require('path');
3 | const escape = require('escape-string-regexp');
4 | const exclusionList = require('metro-config/src/defaults/exclusionList');
5 | const pak = require('../package.json');
6 |
7 | const root = path.resolve(__dirname, '..');
8 | const modules = Object.keys({ ...pak.peerDependencies });
9 |
10 | /**
11 | * Metro configuration
12 | * https://facebook.github.io/metro/docs/configuration
13 | *
14 | * @type {import('metro-config').MetroConfig}
15 | */
16 | const config = {
17 | watchFolders: [root],
18 |
19 | // We need to make sure that only one version is loaded for peerDependencies
20 | // So we block them at the root, and alias them to the versions in example's node_modules
21 | resolver: {
22 | blacklistRE: exclusionList(modules.map((m) => new RegExp(`^${escape(path.join(root, 'node_modules', m))}\\/.*$`))),
23 |
24 | extraNodeModules: modules.reduce((acc, name) => {
25 | acc[name] = path.join(__dirname, 'node_modules', name);
26 | return acc;
27 | }, {}),
28 | },
29 |
30 | transformer: {
31 | getTransformOptions: async () => ({
32 | transform: {
33 | experimentalImportSupport: false,
34 | inlineRequires: true,
35 | },
36 | }),
37 | },
38 | };
39 |
40 | module.exports = mergeConfig(getDefaultConfig(__dirname), config);
41 |
--------------------------------------------------------------------------------
/example/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "camera-kit-react-native-example",
3 | "version": "0.1.0",
4 | "private": true,
5 | "scripts": {
6 | "android": "react-native run-android",
7 | "ios": "react-native run-ios",
8 | "start": "react-native start",
9 | "build:android": "cd android && ./gradlew assembleDebug --no-daemon --console=plain -PreactNativeArchitectures=arm64-v8a",
10 | "build:ios": "cd ios && xcodebuild -workspace CameraKitReactNativeExample.xcworkspace -scheme CameraKitReactNativeExample -configuration Debug -sdk iphonesimulator CC=clang CPLUSPLUS=clang++ LD=clang LDPLUSPLUS=clang++ GCC_OPTIMIZATION_LEVEL=0 GCC_PRECOMPILE_PREFIX_HEADER=YES ASSETCATALOG_COMPILER_OPTIMIZATION=time DEBUG_INFORMATION_FORMAT=dwarf COMPILER_INDEX_STORE_ENABLE=NO"
11 | },
12 | "dependencies": {
13 | "@types/react-native-video": "^5.0.18",
14 | "react": "18.2.0",
15 | "react-native": "0.72.9",
16 | "react-native-video": "^5.2.1"
17 | },
18 | "devDependencies": {
19 | "@babel/core": "^7.20.0",
20 | "@babel/preset-env": "^7.20.0",
21 | "@babel/runtime": "^7.20.0",
22 | "@react-native/metro-config": "^0.72.11",
23 | "babel-plugin-module-resolver": "^5.0.0",
24 | "metro-react-native-babel-preset": "0.76.8",
25 | "pod-install": "^0.1.0"
26 | }
27 | }
28 |
--------------------------------------------------------------------------------
/example/react-native.config.js:
--------------------------------------------------------------------------------
1 | const path = require('path');
2 | const pak = require('../package.json');
3 |
4 | module.exports = {
5 | dependencies: {
6 | [pak.name]: {
7 | root: path.join(__dirname, '..'),
8 | },
9 | },
10 | };
11 |
--------------------------------------------------------------------------------
/example/src/App.tsx:
--------------------------------------------------------------------------------
1 | import React, { useState } from 'react';
2 | import { Button } from './Button';
3 | import { StyleSheet, View, SafeAreaView } from 'react-native';
4 | import { CameraKitContext } from '@snap/camera-kit-react-native';
5 | import { Preview } from './CameraPreview';
6 | import { CameraContext } from './CameraStateContext';
7 |
8 | const apiToken =
9 | 'REPLACE-THIS-WITH-YOUR-API-TOKEN';
10 |
11 | export default function App() {
12 | const [stopRendering, setStopRendering] = useState(false);
13 |
14 | if (stopRendering) {
15 | return (
16 |
17 |
18 |
20 |
21 | );
22 | }
23 |
24 | return (
25 |
26 |
27 |
28 | setStopRendering(true)} />
29 |
30 |
31 |
32 | );
33 | }
34 |
35 | const styles = StyleSheet.create({
36 | container: {
37 | width: '100%',
38 | height: '30%',
39 | flex: 1,
40 | alignItems: 'flex-end',
41 | justifyContent: 'space-between',
42 | },
43 | safeArea: {
44 | flex: 1,
45 | backgroundColor: 'black',
46 | }
47 | });
48 |
--------------------------------------------------------------------------------
/example/src/Button.tsx:
--------------------------------------------------------------------------------
1 | import React, { useRef, type FC } from 'react';
2 | import { Text, StyleSheet, Pressable, Animated } from 'react-native';
3 |
4 | interface ButtonProps {
5 | title: string;
6 | onPress: () => void;
7 | }
8 |
9 | export const Button: FC = ({ title, onPress }) => {
10 | const animatedButtonScaleRef = useRef();
11 |
12 | if (animatedButtonScaleRef.current == undefined) {
13 | animatedButtonScaleRef.current = new Animated.Value(1);
14 | }
15 |
16 | const onPressIn = () => {
17 | Animated.spring(animatedButtonScaleRef.current!, {
18 | toValue: 0.9,
19 | useNativeDriver: true,
20 | }).start();
21 | };
22 |
23 | const onPressOut = () => {
24 | Animated.spring(animatedButtonScaleRef.current!, {
25 | toValue: 1,
26 | useNativeDriver: true,
27 | }).start();
28 | };
29 |
30 | const animatedScaleStyle = {
31 | transform: [{ scale: animatedButtonScaleRef.current }],
32 | };
33 |
34 | return (
35 |
36 |
37 | {title}
38 |
39 |
40 | );
41 | };
42 |
43 | const styles = StyleSheet.create({
44 | button: {
45 | alignItems: 'center',
46 | justifyContent: 'center',
47 | paddingVertical: 6,
48 | paddingHorizontal: 6,
49 | backgroundColor: '#FFFF00',
50 | },
51 | text: {
52 | fontSize: 15,
53 | lineHeight: 21,
54 | color: '#660099',
55 | textTransform: 'uppercase',
56 | },
57 | });
58 |
--------------------------------------------------------------------------------
/example/src/CameraPreview.tsx:
--------------------------------------------------------------------------------
1 | import React, { useEffect, useState, type FC } from 'react';
2 | import { View, Text, StyleSheet, Platform, Dimensions, type LayoutChangeEvent } from 'react-native';
3 | import { CameraPreviewView } from '../../src/CameraPreviewView';
4 | import { Lenses } from './Lenses';
5 | import { useCameraPermissions } from '../../src/useCameraPermissions';
6 | import { useCameraKit } from '../../src/CameraKitContext';
7 | import { Snapshot } from './capture-preview/ImagePreview';
8 | import { VideoPreview } from './capture-preview/VideoPreview';
9 | import { useCameraState, useCameraStateDispatch } from './CameraStateContext';
10 | import { Button } from './Button';
11 | import type { Rect } from '../../src/CameraKitContextModule';
12 |
13 | /**
14 | * An interface that defines a single method onStopRendering which takes no parameters and returns void.
15 | */
16 | interface PreviewProps {
17 | onStopRendering: () => void;
18 | }
19 |
20 | const platformScale = Platform.OS === 'android' ? Dimensions.get('screen').scale : 1;
21 |
22 | const reduceHeightTo70Percent = (rect: Rect): Rect => ({
23 | ...rect,
24 | bottom: rect.bottom * 0.7,
25 | });
26 |
27 | /**
28 | * A function to calculate the preview size based on the LayoutChangeEvent.
29 | *
30 | * @param {LayoutChangeEvent} event - the event containing layout information
31 | * @returns {Rect} - the preview size
32 | */
33 | export const Preview: FC = ({ onStopRendering }) => {
34 | const { position, mirrorHorizontally, videoRecording, reduceSafeArea } = useCameraState();
35 | const dispatch = useCameraStateDispatch();
36 | const { takeSnapshot, takeVideo } = useCameraKit();
37 | const [showCamera, setShowCamera] = useState(true);
38 | const { permissionStatus, request } = useCameraPermissions();
39 | const [previewSize, setPreviewSize] = useState(undefined);
40 |
41 | const safeArea = reduceSafeArea && previewSize ? reduceHeightTo70Percent(previewSize) : undefined;
42 |
43 | useEffect(() => {
44 | if (Platform.OS === 'android' && !permissionStatus['android.permission.CAMERA']) {
45 | request(['android.permission.CAMERA']);
46 | }
47 | }, [request]);
48 |
49 | /**
50 | * A function to calculate the preview size based on the LayoutChangeEvent.
51 | *
52 | * @param {LayoutChangeEvent} event - the event containing layout information
53 | * @returns {void}
54 | */
55 | const calculatePreviewSize = (event: LayoutChangeEvent) => {
56 | const {
57 | nativeEvent: {
58 | layout: { x, y, width, height },
59 | },
60 | } = event;
61 |
62 | setPreviewSize({
63 | top: x * platformScale,
64 | left: y * platformScale,
65 | bottom: height * platformScale,
66 | right: width * platformScale,
67 | });
68 | };
69 |
70 | /**
71 | * Function to handle video recording logic.
72 | * - If video recording is active, stop it.
73 | * - If video recording is not active, start it.
74 | */
75 | const onVideoRecording = () => {
76 | if (videoRecording) {
77 | videoRecording.stop().then(({ uri }) => {
78 | dispatch({ type: 'setVideo', videoUri: uri });
79 | dispatch({ type: 'setVideoRecording', videoRecording: undefined });
80 | });
81 | } else {
82 | dispatch({ type: 'setVideoRecording', videoRecording: takeVideo() });
83 | }
84 | };
85 |
86 | return (
87 |
88 | {showCamera ? (
89 |
96 | ) : (
97 |
98 | )}
99 |
100 |
101 | Camera permissions: {permissionStatus['android.permission.CAMERA']}
102 |
103 |
104 |
125 |
126 |
127 |
128 |
129 | );
130 | };
131 |
132 | const styles = StyleSheet.create({
133 | container: {
134 | position: 'absolute',
135 | width: '50%',
136 | height: '45%',
137 | alignItems: 'flex-end',
138 | justifyContent: 'space-between',
139 | right: 0,
140 | },
141 | box: {
142 | position: 'relative',
143 | width: '100%',
144 | height: '100%',
145 | backgroundColor: 'black',
146 | },
147 | });
148 |
--------------------------------------------------------------------------------
/example/src/CameraStateContext.tsx:
--------------------------------------------------------------------------------
1 | import React, { createContext, useReducer, type FC, type Dispatch, useContext, type Reducer } from 'react';
2 | import type { CameraOptions } from '../../src/NativeView';
3 | import type { VideoRecording } from '../../src/CameraKitContext';
4 |
5 | interface CameraState {
6 | position: CameraOptions['position'];
7 | mirrorHorizontally: boolean;
8 | snapshotUri: string | undefined;
9 | videoRecording: VideoRecording | undefined;
10 | videoUri: string | undefined;
11 | reduceSafeArea: boolean;
12 | }
13 |
14 | export function assertExhaustive(_: never, message: string = `Reached unexpected case in exhaustive switch`): never {
15 | throw new Error(message);
16 | }
17 |
18 | type CameraStateActions =
19 | | {
20 | type: 'toggleCameraPosition' | 'toggleMirrorHorizontally' | 'toggleSafeArea';
21 | }
22 | | { type: 'setSnapshot'; snapshotUri: string | undefined }
23 | | { type: 'setVideoRecording'; videoRecording: VideoRecording | undefined }
24 | | {
25 | type: 'setVideo';
26 | videoUri: string | undefined;
27 | };
28 |
29 | const initialState = Object.freeze({
30 | position: 'front',
31 | mirrorHorizontally: false,
32 | snapshotUri: undefined,
33 | videoRecording: undefined,
34 | videoUri: undefined,
35 | reduceSafeArea: false,
36 | });
37 |
38 | export const CameraStateContext = createContext(initialState);
39 | export const CameraStateDispatchContext = createContext>(() => {});
40 |
41 | /**
42 | * Reducer function for managing camera state based on different actions.
43 | *
44 | * @param {CameraState} state - The current state of the camera
45 | * @param {CameraStateActions} action - The action to be performed on the camera state
46 | * @return {CameraState} The updated camera state after applying the action
47 | */
48 | const cameraStateReducer: Reducer = (
49 | state: CameraState,
50 | action: CameraStateActions
51 | ) => {
52 | switch (action.type) {
53 | case 'toggleCameraPosition':
54 | return {
55 | ...state,
56 | position: state.position === 'front' ? 'back' : 'front',
57 | };
58 |
59 | case 'toggleMirrorHorizontally':
60 | return {
61 | ...state,
62 | mirrorHorizontally: !state.mirrorHorizontally,
63 | };
64 | case 'setSnapshot':
65 | return {
66 | ...state,
67 | snapshotUri: action.snapshotUri,
68 | };
69 | case 'setVideoRecording':
70 | return {
71 | ...state,
72 | videoRecording: action.videoRecording,
73 | };
74 | case 'setVideo':
75 | return {
76 | ...state,
77 | videoUri: action.videoUri,
78 | };
79 | case 'toggleSafeArea':
80 | return {
81 | ...state,
82 | reduceSafeArea: !state.reduceSafeArea,
83 | };
84 | default:
85 | assertExhaustive(action);
86 | }
87 | };
88 |
89 | /**
90 | * React functional component for managing camera context.
91 | * It provides the camera state and dispatch functions to its child components through context providers.
92 | *
93 | * @param {FC} children - The child components
94 | * @return {JSX.Element} The JSX element representing the camera context provider
95 | */
96 | export const CameraContext: FC = ({ children }) => {
97 | const [state, dispatch] = useReducer(cameraStateReducer, initialState);
98 |
99 | return (
100 |
101 | {children}
102 |
103 | );
104 | };
105 |
106 | /**
107 | * A custom React Hook that provides access to the camera state.
108 | *
109 | * @return {CameraState} The camera state object
110 | */
111 | export function useCameraState() {
112 | const cameraState = useContext(CameraStateContext);
113 |
114 | if (!cameraState) {
115 | throw new Error('useCameraState must be used within a CameraContext');
116 | }
117 |
118 | return cameraState;
119 | }
120 |
121 | /**
122 | * A custom hook that returns the camera state dispatch function.
123 | *
124 | * @return {Function} The camera state dispatch function
125 | */
126 | export function useCameraStateDispatch() {
127 | const dispatch = useContext(CameraStateDispatchContext);
128 |
129 | if (!dispatch) {
130 | throw new Error('useCameraStateDispatch must be used within a CameraContext');
131 | }
132 |
133 | return dispatch;
134 | }
135 |
--------------------------------------------------------------------------------
/example/src/Lenses.tsx:
--------------------------------------------------------------------------------
1 | import { useEffect, useState } from 'react';
2 | import { Button } from './Button';
3 | import { FlatList, Image, Pressable, StyleSheet, View } from 'react-native';
4 | import { useCameraKit, type Lens } from '@snap/camera-kit-react-native';
5 | import React from 'react';
6 |
7 | const groupId = 'REPLACE-THIS-WITH-YOUR-LENSES-GROUP-ID';
8 | const launchDataLensId = 'REPLACE-THIS-WITH-YOUR-LENSID-WITH-LAUNCH-DATA';
9 |
10 | /**
11 | * A function that retrieves launch data based on a provided lens ID.
12 | *
13 | * @param {string} lensId - The ID of the lens to retrieve launch data for.
14 | * @return {object | undefined} Returns an object with launch parameters if the provided lens ID matches the stored data, otherwise returns undefined.
15 | */
16 | const getLaunchData = (lensId: string) =>
17 | launchDataLensId === lensId
18 | ? {
19 | launchParams: { text: new Date().toLocaleString() },
20 | }
21 | : undefined;
22 |
23 | /**
24 | * It defines a React component called Lenses that fetches a list of lenses based on a group ID, allows
25 | * the user to apply or remove lenses, and displays them in a horizontal list using FlatList. It uses
26 | * hooks like useState, useEffect, and custom hook useCameraKit for managing state and side effects.
27 | * The applyLens and removeLens functions interact with a camera kit, and error handling
28 | * is done using catch(console.error)
29 | *
30 | * @return {JSX.Element} The JSX element representing the component.
31 | */
32 | export const Lenses = () => {
33 | const [lenses, setLenses] = useState([]);
34 | const { loadLensGroup, applyLens, removeLens, isSessionReady } = useCameraKit();
35 | useEffect(() => {
36 | if (isSessionReady) {
37 | loadLensGroup(groupId).then(setLenses).catch(console.error);
38 | }
39 | }, [loadLensGroup, isSessionReady]);
40 |
41 | return (
42 |
43 |
64 | );
65 | };
66 |
67 | const styles = StyleSheet.create({
68 | container: {
69 | position: 'absolute',
70 | bottom: 45,
71 | },
72 | lensIcon: {
73 | marginRight: 10,
74 | width: 75,
75 | height: 75,
76 | },
77 | });
78 |
--------------------------------------------------------------------------------
/example/src/capture-preview/Hint.tsx:
--------------------------------------------------------------------------------
1 | import React, { type FC } from 'react';
2 | import { Text, StyleSheet } from 'react-native';
3 |
4 | export const Hint: FC<{ text: string }> = ({ text }) => {
5 | return {text};
6 | };
7 |
8 | const styles = StyleSheet.create({
9 | hint: {
10 | bottom: 10,
11 | left: 10,
12 | color: 'white',
13 | position: 'absolute',
14 | textShadowColor: 'black',
15 | textShadowRadius: 5,
16 | },
17 | });
18 |
--------------------------------------------------------------------------------
/example/src/capture-preview/ImagePreview.tsx:
--------------------------------------------------------------------------------
1 | import type { FC } from 'react';
2 | import React from 'react';
3 | import { View, Pressable, Image } from 'react-native';
4 | import { globalStyles } from '../globalStyles';
5 | import { useCameraState, useCameraStateDispatch } from '../CameraStateContext';
6 | import { Hint } from './Hint';
7 |
8 | /**
9 | * React functional component that displays a snapshot image and allows the user to close it by pressing on it.
10 | *
11 | * @return {JSX.Element} The rendered snapshot view component
12 | */
13 | export const Snapshot: FC = () => {
14 | const { snapshotUri } = useCameraState();
15 | const dispatch = useCameraStateDispatch();
16 |
17 | if (!snapshotUri) {
18 | return null;
19 | }
20 |
21 | return (
22 |
23 | {
25 | dispatch({ type: 'setSnapshot', snapshotUri: undefined });
26 | }}
27 | >
28 |
34 |
35 |
36 |
37 | );
38 | };
39 |
--------------------------------------------------------------------------------
/example/src/capture-preview/VideoPreview.tsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { View, Pressable } from 'react-native';
3 | import Video from 'react-native-video';
4 | import { globalStyles } from '../globalStyles';
5 | import { useCameraState, useCameraStateDispatch } from '../CameraStateContext';
6 | import { Hint } from './Hint';
7 |
8 | /**
9 | * Function component for displaying a video preview of the captured video.
10 | *
11 | * @return {JSX.Element} The JSX element representing the video preview.
12 | */
13 | export const VideoPreview = () => {
14 | const { videoUri } = useCameraState();
15 | const dispatch = useCameraStateDispatch();
16 |
17 | if (!videoUri) {
18 | return null;
19 | }
20 |
21 | return (
22 |
23 | {
25 | dispatch({ type: 'setVideo', videoUri: undefined });
26 | }}
27 | >
28 |
29 |
30 |
31 |
32 | );
33 | };
34 |
--------------------------------------------------------------------------------
/example/src/globalStyles.tsx:
--------------------------------------------------------------------------------
1 | import { StyleSheet } from 'react-native';
2 |
3 | export const globalStyles = StyleSheet.create({
4 | imageOrVideoPreviewContainer: {
5 | position: 'absolute',
6 | top: 10,
7 | left: 10,
8 | width: '50%',
9 | height: '50%',
10 | borderWidth: 1,
11 | },
12 | fillParent: {
13 | width: '100%',
14 | height: '100%',
15 | },
16 | });
17 |
--------------------------------------------------------------------------------
/ios/CameraKitContextModule.mm:
--------------------------------------------------------------------------------
1 | #import
2 |
3 | @interface RCT_EXTERN_MODULE(CameraKitContext, NSObject)
4 |
5 | RCT_EXTERN_METHOD(loadLensGroup:(NSString *)groupId:(RCTPromiseResolveBlock)resolve
6 | reject:(RCTPromiseRejectBlock)reject)
7 |
8 | RCT_EXTERN_METHOD(applyLens:(NSString *)lensId
9 | :(NSDictionary *)launchData
10 | :(RCTPromiseResolveBlock)resolve reject
11 | :(RCTPromiseRejectBlock)reject)
12 |
13 | RCT_EXTERN_METHOD(removeLens:(RCTPromiseResolveBlock)resolve
14 | reject:(RCTPromiseRejectBlock)reject)
15 |
16 | RCT_EXTERN_METHOD(closeSession:(RCTPromiseResolveBlock)resolve
17 | reject:(RCTPromiseRejectBlock)reject)
18 |
19 | RCT_EXTERN_METHOD(createNewSession:(NSString *)apiKey:(RCTPromiseResolveBlock)resolve
20 | reject:(RCTPromiseRejectBlock)reject)
21 |
22 | RCT_EXTERN_METHOD(takeSnapshot:(NSString *)format
23 | :(nonnull NSNumber)quality
24 | :(RCTPromiseResolveBlock)resolve reject
25 | :(RCTPromiseRejectBlock)reject)
26 |
27 | RCT_EXTERN_METHOD(takeVideo:(RCTPromiseResolveBlock)resolve reject
28 | :(RCTPromiseRejectBlock)reject)
29 |
30 | RCT_EXTERN_METHOD(stopTakingVideo:(RCTPromiseResolveBlock)resolve reject
31 | :(RCTPromiseRejectBlock)reject)
32 |
33 | + (BOOL)requiresMainQueueSetup
34 | {
35 | return NO;
36 | }
37 |
38 | @end
39 |
--------------------------------------------------------------------------------
/ios/CameraKitEventEmitter.m:
--------------------------------------------------------------------------------
1 | #import
2 | #import
3 | #import
4 |
5 | @interface RCT_EXTERN_MODULE(CameraKitEventEmitter, RCTEventEmitter)
6 |
7 | RCT_EXTERN_METHOD(supportedEvents)
8 |
9 | @end
10 |
--------------------------------------------------------------------------------
/ios/CameraKitEventEmitter.swift:
--------------------------------------------------------------------------------
1 | import Foundation
2 |
3 | @objc(CameraKitEventEmitter)
4 | open class CameraKitEventEmitter: RCTEventEmitter {
5 | open func sendError(exception: NSException) {
6 | if self.bridge.module(for: self.classForCoder) != nil {
7 | var error: [String: String] = [:]
8 |
9 | error["message"] = exception.name.rawValue
10 | error["cause"] = exception.reason
11 | error["stackTrace"] = Thread.callStackSymbols.joined(separator: "\n")
12 |
13 | super.sendEvent(withName: "error", body: error)
14 | }
15 | }
16 |
17 | @objc override open func supportedEvents() -> [String] {
18 | ["error", "warn", "log", "info", "debug"]
19 | }
20 |
21 | override open class func requiresMainQueueSetup() -> Bool {
22 | false
23 | }
24 | }
25 |
--------------------------------------------------------------------------------
/ios/CameraKitReactNative-Bridging-Header.h:
--------------------------------------------------------------------------------
1 | #import
2 | #import
3 | #import
4 |
--------------------------------------------------------------------------------
/ios/CameraPreviewManager.m:
--------------------------------------------------------------------------------
1 | #import
2 | #import
3 | #import
4 | #import
5 |
6 | @interface RCT_EXTERN_MODULE(CameraPreviewManager, RCTViewManager)
7 |
8 | RCT_EXPORT_VIEW_PROPERTY(cameraPosition, NSString)
9 | RCT_EXPORT_VIEW_PROPERTY(safeRenderArea, NSDictionary)
10 | RCT_EXPORT_VIEW_PROPERTY(mirrorFramesHorizontally, BOOL)
11 |
12 | @end
13 |
--------------------------------------------------------------------------------
/ios/CameraPreviewManager.swift:
--------------------------------------------------------------------------------
1 | import Foundation
2 | import SCSDKCameraKit
3 |
4 | public class CameraPreviewError: UILabel, CameraViewProtocol {
5 | @objc public var cameraPosition: NSString = ""
6 |
7 | public init() {
8 | super.init(frame: CGRect.zero)
9 |
10 | let errorMessage = "Error: [CameraKitReactNative] Attempt to render CameraPreviewView when CameraKit session is not initialized."
11 | print(errorMessage)
12 |
13 | text = errorMessage
14 | textColor = .red
15 | numberOfLines = 0
16 | lineBreakMode = .byWordWrapping
17 | }
18 |
19 | @available(*, unavailable)
20 | required init?(coder: NSCoder) {
21 | fatalError("init(coder:) has not been implemented")
22 | }
23 | }
24 |
25 | @objc(CameraPreviewManager) public class CameraPreviewManager: RCTViewManager {
26 | override public static func requiresMainQueueSetup() -> Bool {
27 | true
28 | }
29 |
30 | override public func view() -> UIView! {
31 | guard let cameraKitContext = (bridge.module(for: CameraKitContextModule.self) as? CameraKitContextModule) else {
32 | return CameraPreviewError()
33 | }
34 | return CameraPreviewView(context: cameraKitContext)
35 | }
36 | }
37 |
--------------------------------------------------------------------------------
/ios/CameraPreviewView.swift:
--------------------------------------------------------------------------------
1 | import Foundation
2 | import SCSDKCameraKit
3 | import UIKit
4 |
5 | public protocol CameraViewProtocol {
6 | var cameraPosition: NSString { get set }
7 | }
8 |
9 | public class CameraPreviewView: PreviewView, CameraViewProtocol {
10 | @objc public var cameraPosition: NSString = "front"
11 | @objc public var safeRenderArea: [String: NSNumber]? = nil
12 | @objc public var mirrorFramesHorizontally: Bool = false
13 |
14 | private var isOutputAttached = false
15 | private let sessionQueue = DispatchQueue(label: "CameraPreviewViewQueue", qos: .default)
16 | private let cameraKitContext: CameraKitContextModule
17 | private let captureSession: AVCaptureSession = .init()
18 |
19 | init(context: CameraKitContextModule) {
20 | cameraKitContext = context
21 | super.init(frame: CGRect.zero)
22 | automaticallyConfiguresTouchHandler = true
23 | }
24 |
25 | @available(*, unavailable)
26 | required init?(coder: NSCoder) {
27 | fatalError("init(coder:) has not been implemented")
28 | }
29 |
30 | @objc func orientationChanged(_ notification: Notification) {
31 | guard let session = cameraKitContext.session else {
32 | return
33 | }
34 |
35 | switch UIDevice.current.orientation {
36 | case .landscapeLeft:
37 | session.videoOrientation = .landscapeRight
38 | case .landscapeRight:
39 | session.videoOrientation = .landscapeLeft
40 | default:
41 | session.videoOrientation = .portrait
42 | }
43 | }
44 |
45 | override public final func didSetProps(_ changedProps: [String]!) {
46 | NotificationCenter.default.addObserver(self, selector: #selector(orientationChanged), name: UIDevice.orientationDidChangeNotification, object: nil)
47 |
48 | guard let session = cameraKitContext.session else {
49 | return
50 | }
51 |
52 | if changedProps.contains("mirrorFramesHorizontally") {
53 | cameraKitContext.avInput?.videoMirrored = mirrorFramesHorizontally
54 | }
55 |
56 | if changedProps.contains("cameraPosition") {
57 | session.cameraPosition = cameraPosition == "front" ? .front : .back
58 | }
59 |
60 | if changedProps.contains("safeRenderArea") {
61 | if let safeRenderArea {
62 | safeArea = CGRect(
63 | x: safeRenderArea["top"]?.intValue ?? 0,
64 | y: safeRenderArea["left"]?.intValue ?? 0,
65 | width: safeRenderArea["right"]?.intValue ?? 0,
66 | height: safeRenderArea["bottom"]?.intValue ?? 0)
67 | }
68 | else {
69 | safeArea = CGRect(x: 0, y: 0, width: frame.size.width, height: frame.size.height)
70 | }
71 | }
72 |
73 | if !isOutputAttached {
74 | isOutputAttached = true
75 |
76 | cameraKitContext.startSession(captureSession: captureSession, output: self)
77 | cameraKitContext.avInput?.videoMirrored = mirrorFramesHorizontally
78 | }
79 | }
80 |
81 | override public func removeFromSuperview() {
82 | captureSession.stopRunning()
83 | cameraKitContext.stopSession()
84 | }
85 |
86 | deinit {
87 | NotificationCenter.default.removeObserver(self, name: UIDevice.orientationDidChangeNotification, object: nil)
88 | }
89 | }
90 |
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "@snap/camera-kit-react-native",
3 | "version": "0.6.0",
4 | "description": "Camera Kit wrapper for React Native",
5 | "main": "lib/commonjs/index",
6 | "module": "lib/module/index",
7 | "types": "lib/typescript/src/index.d.ts",
8 | "react-native": "src/index",
9 | "source": "src/index",
10 | "files": [
11 | "src",
12 | "lib",
13 | "android",
14 | "ios",
15 | "cpp",
16 | "*.podspec",
17 | "!ios/build",
18 | "!android/build",
19 | "!android/gradle",
20 | "!android/gradlew",
21 | "!android/gradlew.bat",
22 | "!android/local.properties",
23 | "!**/__tests__",
24 | "!**/__fixtures__",
25 | "!**/__mocks__",
26 | "!**/.*"
27 | ],
28 | "scripts": {
29 | "example": "yarn workspace camera-kit-react-native-example",
30 | "test": "jest",
31 | "typecheck": "tsc --noEmit",
32 | "lint": "eslint \"**/*.{js,ts,tsx}\" && prettier -l \"**/*.{js,ts,tsx}\"",
33 | "clean": "del-cli android/build example/android/build example/android/app/build example/ios/build lib docs",
34 | "prepare": "bob build",
35 | "docs": "npx typedoc src/index.tsx --tsconfig tsconfig.json"
36 | },
37 | "keywords": [
38 | "react-native",
39 | "ios",
40 | "android"
41 | ],
42 | "repository": "https://github.com/snapchat/camera-kit-react-native",
43 | "author": "Snap Inc.",
44 | "license": "See the LICENSE file",
45 | "homepage": "https://github.com/snapchat/camera-kit-react-native#readme",
46 | "devDependencies": {
47 | "@react-native/eslint-config": "^0.74.0",
48 | "@types/jest": "^28.1.2",
49 | "@types/react": "~17.0.21",
50 | "@types/react-native": "0.70.0",
51 | "del-cli": "^5.0.0",
52 | "eslint": "^8.4.1",
53 | "jest": "^28.1.1",
54 | "pod-install": "^0.1.0",
55 | "prettier": "^2.0.5",
56 | "react": "18.2.0",
57 | "react-native": "0.72.9",
58 | "react-native-builder-bob": "^0.20.0",
59 | "turbo": "^1.10.7",
60 | "typescript": "^5.0.2"
61 | },
62 | "resolutions": {
63 | "@types/react": "17.0.21"
64 | },
65 | "peerDependencies": {
66 | "react": "*",
67 | "react-native": "*"
68 | },
69 | "workspaces": [
70 | "example"
71 | ],
72 | "packageManager": "yarn@3.6.1",
73 | "engines": {
74 | "node": ">= 20"
75 | },
76 | "jest": {
77 | "preset": "react-native",
78 | "modulePathIgnorePatterns": [
79 | "/example/node_modules",
80 | "/lib/"
81 | ]
82 | },
83 | "eslintConfig": {
84 | "root": true,
85 | "extends": [
86 | "@react-native"
87 | ],
88 | "rules": {
89 | "prettier/prettier": 0,
90 | "eqeqeq": "off"
91 | }
92 | },
93 | "eslintIgnore": [
94 | "node_modules/",
95 | "lib/"
96 | ],
97 | "prettier": {
98 | "quoteProps": "consistent",
99 | "singleQuote": true,
100 | "tabWidth": 4,
101 | "trailingComma": "es5",
102 | "useTabs": false
103 | },
104 | "react-native-builder-bob": {
105 | "source": "src",
106 | "output": "lib",
107 | "targets": [
108 | "commonjs",
109 | "module",
110 | [
111 | "typescript",
112 | {
113 | "project": "tsconfig.build.json"
114 | }
115 | ]
116 | ]
117 | }
118 | }
119 |
--------------------------------------------------------------------------------
/scripts/pod-install.cjs:
--------------------------------------------------------------------------------
1 | const child_process = require('child_process');
2 |
3 | module.exports = {
4 | name: 'pod-install',
5 | factory() {
6 | return {
7 | hooks: {
8 | afterAllInstalled(project, options) {
9 | if (process.env.POD_INSTALL === '0') {
10 | return;
11 | }
12 |
13 | if (
14 | options &&
15 | (options.mode === 'update-lockfile' ||
16 | options.mode === 'skip-build')
17 | ) {
18 | return;
19 | }
20 |
21 | const result = child_process.spawnSync(
22 | 'yarn',
23 | ['pod-install', 'example/ios'],
24 | {
25 | cwd: project.cwd,
26 | env: process.env,
27 | stdio: 'inherit',
28 | encoding: 'utf-8',
29 | shell: true,
30 | }
31 | );
32 |
33 | if (result.status !== 0) {
34 | throw new Error('Failed to run pod-install');
35 | }
36 | },
37 | },
38 | };
39 | },
40 | };
41 |
--------------------------------------------------------------------------------
/src/CameraKitContextModule.ts:
--------------------------------------------------------------------------------
1 | import { getNativeModule } from './verifyNativeModule';
2 | export interface Media {
3 | imageUrl: string | undefined;
4 | }
5 |
6 | export interface Snapcode {
7 | imageUrl: string;
8 | deepLink: string;
9 | }
10 |
11 | export interface LensLaunchData {
12 | launchParams?: Record;
13 | }
14 |
15 | export interface Lens {
16 | id: string;
17 | name: string;
18 | icons: Media[];
19 | groupId: string;
20 | previews: Media[];
21 | snapcodes: Snapcode[];
22 | facingPreference?: 'FRONT' | 'BACK';
23 | vendorData: Record;
24 | }
25 |
26 | export type Rect = Record<'top' | 'left' | 'bottom' | 'right', number>;
27 | export type ImageFormats = 'JPEG' | 'PNG';
28 |
29 | interface CameraKitContextModule {
30 | createNewSession(apiKey: string): Promise;
31 | closeSession(): Promise;
32 | loadLensGroup(groupId: string): Promise;
33 | applyLens(lensId: string, launchData: LensLaunchData): Promise;
34 | removeLens(): Promise;
35 | takeSnapshot(format: ImageFormats, quality: number): Promise<{ uri: string }>;
36 | takeVideo(): Promise<{ uri: string }>;
37 | stopTakingVideo(): Promise;
38 | }
39 |
40 | /**
41 | * Checks if the input value is a supported image format.
42 | *
43 | * @param {unknown} value - the value to check
44 | * @return {boolean} true if the value is 'JPEG' or 'PNG', false otherwise
45 | */
46 | export function isSupportedImageFormat(value: unknown): value is ImageFormats {
47 | return value === 'JPEG' || value === 'PNG';
48 | }
49 |
50 | export const CameraKitReactNative = getNativeModule('CameraKitContext');
51 |
--------------------------------------------------------------------------------
/src/CameraPreviewView.tsx:
--------------------------------------------------------------------------------
1 | import { useCameraKit } from './CameraKitContext';
2 | import React, { type FC } from 'react';
3 | import { NativeView, type NativeCameraViewProps } from './NativeView';
4 | import { Text } from 'react-native';
5 |
6 | /**
7 | * Renders the CameraPreviewView component based on the session readiness.
8 | *
9 | * @param {NativeCameraViewProps} props - the properties passed to the component
10 | * @return {ReactElement} the rendered component based on session readiness
11 | */
12 | export const CameraPreviewView: FC = (props) => {
13 | const { isSessionReady } = useCameraKit();
14 |
15 | if (!isSessionReady) {
16 | return Session is not ready...;
17 | }
18 |
19 | return ;
20 | };
21 |
--------------------------------------------------------------------------------
/src/Errors.ts:
--------------------------------------------------------------------------------
1 | import { isRecord } from './TypeGuards';
2 |
3 | export interface CameraKitError {
4 | message: string;
5 | stackTrace: string;
6 | cause?: string;
7 | }
8 |
9 | export interface AndroidStackTraceElement {
10 | class: string;
11 | file: string;
12 | lineNumber: number;
13 | methodName: string;
14 | }
15 |
16 | export interface NativeError {
17 | code: string;
18 | message: string;
19 | nativeStackAndroid: Array;
20 | nativeStackIOS: Array;
21 | userInfo?: Record;
22 | }
23 |
24 | /**
25 | * Checks if the error is a native error.
26 | *
27 | * @param {any} error - the error to check
28 | * @return {boolean} true if the error is a native error, false otherwise
29 | */
30 | export const isNativeError = (error: any): error is NativeError =>
31 | isRecord(error) && (error.nativeStackAndroid != undefined || error.nativeStackIOS != undefined);
32 |
33 | /**
34 | * Checks if the given error is a CameraKitError.
35 | *
36 | * @param {any} error - The error to be checked.
37 | * @return {boolean} Returns true if the error is a CameraKitError, otherwise false.
38 | */
39 | export const isCameraKitError = (error: any): error is CameraKitError =>
40 | isRecord(error) && error.message != undefined && error.stackTrace != undefined;
41 |
42 | /**
43 | * Generates a string representation of the Android native stack trace.
44 | *
45 | * @param {Array} nativeStackAndroid - The array of Android stack trace elements
46 | * @return {string} The string representation of the Android native stack trace
47 | */
48 | export const stackTraceAndroidToString = (nativeStackAndroid: Array): string =>
49 | nativeStackAndroid.reduce((acc, { lineNumber, file, methodName, class: className }) => {
50 | const lineNumberString = lineNumber >= 0 ? `:${lineNumber}` : '';
51 | const fileString = file ?? 'Unknown Source';
52 | return `${acc}\t${className}.${methodName}(${fileString}${lineNumberString})\n`;
53 | }, 'Call Stack\n');
54 |
--------------------------------------------------------------------------------
/src/NativeView.ts:
--------------------------------------------------------------------------------
1 | import { type ViewProps } from 'react-native';
2 | import { getNativeViewManager } from './verifyNativeModule';
3 | import type { Rect } from './CameraKitContextModule';
4 |
5 | export interface CameraOptions {
6 | position: 'front' | 'back';
7 | mirrorFramesHorizontally: boolean;
8 | cameraPosition: 'front' | 'back';
9 | safeRenderArea: Rect;
10 | }
11 |
12 | export type NativeCameraViewProps = ViewProps & Partial;
13 |
14 | export const NativeView = getNativeViewManager('CameraPreview');
15 |
--------------------------------------------------------------------------------
/src/TypeGuards.ts:
--------------------------------------------------------------------------------
1 | type UnknownRecord = Record;
2 |
3 | export function isRecord(value: unknown): value is UnknownRecord {
4 | return typeof value === 'object' && value !== null && !Array.isArray(value);
5 | }
6 |
7 | export function isString(value: unknown): value is string {
8 | return typeof value === 'string';
9 | }
10 |
11 | export function isNumber(value: unknown): value is number {
12 | return typeof value === 'number';
13 | }
14 |
15 | export const isValidNumber = (value: unknown): value is number => {
16 | return isNumber(value) && !Number.isNaN(value) && Number.isFinite(value);
17 | };
18 |
--------------------------------------------------------------------------------
/src/__tests__/index.test.tsx:
--------------------------------------------------------------------------------
1 | it.todo('write a test');
2 |
--------------------------------------------------------------------------------
/src/index.tsx:
--------------------------------------------------------------------------------
1 | export { CameraKitContext, useCameraKit } from './CameraKitContext';
2 | export type { VideoRecording } from './CameraKitContext';
3 | export { CameraPreviewView } from './CameraPreviewView';
4 | export type { Lens, Rect } from './CameraKitContextModule';
5 | export type { CameraOptions } from './NativeView';
6 | export { useCameraPermissions } from './useCameraPermissions';
7 | export { Logger } from './logger/Logger';
8 | export type { LogLevel, LogEntry } from './logger/Logger';
9 | export { isCameraKitError, isNativeError } from './Errors';
10 | export type { NativeError, CameraKitError } from './Errors';
11 | export { isSupportedImageFormat } from './CameraKitContextModule';
12 | export type { ImageFormats } from './CameraKitContextModule';
13 | export { useIsMounted } from './useIsMounted';
14 | export { getNativeModule, getNativeViewManager } from './verifyNativeModule';
15 | export type { LensLaunchData } from './CameraKitContextModule';
16 | export { NativeEventEmitter } from 'react-native';
17 | export type { NativeModule, EmitterSubscription } from 'react-native';
18 | export { NativeView } from './NativeView';
19 | export type { NativeCameraViewProps } from './NativeView';
20 | export * from './logger/cameraKitLogEvents';
21 | export * from './CameraKitContextModule';
22 | export * from './CameraKitContext';
23 |
--------------------------------------------------------------------------------
/src/logger/Logger.ts:
--------------------------------------------------------------------------------
1 | import type { EmitterSubscription } from 'react-native';
2 | import {
3 | stackTraceAndroidToString,
4 | isNativeError,
5 | type CameraKitError,
6 | type NativeError,
7 | isCameraKitError,
8 | } from '../Errors';
9 | import { cameraKitLogEvents } from './cameraKitLogEvents';
10 |
11 | export type LogEntry =
12 | | {
13 | level: 'error';
14 | message: CameraKitError | NativeError | unknown;
15 | }
16 | | { level: 'warn' | 'log' | 'info' | 'debug'; message: unknown };
17 |
18 | export type LogLevel = LogEntry['level'];
19 |
20 | export class Logger {
21 | private levels: Set = new Set();
22 | private subscriptions: Map = new Map();
23 |
24 | /**
25 | * Set the new log levels and update subscriptions accordingly.
26 | *
27 | * @param {LogLevel[]} newLevels - An array of new log levels to set.
28 | * @return {void}
29 | */
30 | setLevels(newLevels: LogLevel[]) {
31 | const newLevelsSet = new Set(newLevels);
32 |
33 | const levelsToSubscribe = newLevels.filter((item) => !this.levels.has(item));
34 | const levelsToUnsubscribe = [...this.levels].filter((item) => !newLevelsSet.has(item));
35 |
36 | if (levelsToSubscribe.length === 0 && levelsToUnsubscribe.length === 0) {
37 | return;
38 | }
39 |
40 | this.levels = newLevelsSet;
41 |
42 | levelsToUnsubscribe.forEach((level) => {
43 | this.subscriptions.get(level)?.remove();
44 | this.subscriptions.delete(level);
45 | });
46 |
47 | levelsToSubscribe.forEach((level) => {
48 | this.subscriptions.set(
49 | level,
50 | cameraKitLogEvents.addListener(level, (event: LogEntry['message']) => {
51 | this.log({ level, message: event });
52 | })
53 | );
54 | });
55 | }
56 |
57 | /**
58 | * Log a message based on the log entry's level.
59 | *
60 | * @param {LogEntry} logEntry - the log entry to be processed
61 | */
62 | log(logEntry: LogEntry) {
63 | if (this.levels.has(logEntry.level)) {
64 | switch (logEntry.level) {
65 | case 'error': {
66 | if (isNativeError(logEntry.message)) {
67 | console[logEntry.level](logEntry.message);
68 | console[logEntry.level](stackTraceAndroidToString(logEntry.message.nativeStackAndroid));
69 | } else if (isCameraKitError(logEntry.message)) {
70 | console[logEntry.level](
71 | logEntry.message.message,
72 | logEntry.message.cause ?? '',
73 | logEntry.message.stackTrace
74 | );
75 | } else {
76 | console[logEntry.level](logEntry.message);
77 | }
78 | break;
79 | }
80 | default: {
81 | console[logEntry.level](logEntry.message);
82 | }
83 | }
84 | }
85 | }
86 | }
87 |
88 | export const logger = new Logger();
89 |
--------------------------------------------------------------------------------
/src/logger/cameraKitLogEvents.tsx:
--------------------------------------------------------------------------------
1 | import { NativeEventEmitter, type NativeModule } from 'react-native';
2 | import { getNativeModule } from '../verifyNativeModule';
3 |
4 | export const cameraKitLogEvents = new NativeEventEmitter(getNativeModule('CameraKitEventEmitter'));
5 |
--------------------------------------------------------------------------------
/src/useCameraPermissions.tsx:
--------------------------------------------------------------------------------
1 | import { useState, useMemo } from 'react';
2 | import { PermissionsAndroid, type PermissionStatus, Platform, type Permission } from 'react-native';
3 | import { useIsMounted } from './useIsMounted';
4 |
5 | /**
6 | * Custom hook that manages camera permissions.
7 | *
8 | * @return {Object} An object with the current permission status and a request function to ask for permissions.
9 | */
10 | export const useCameraPermissions = () => {
11 | const [permissionStatus, setPermissionStatus] = useState({} as Record);
12 | const { isMounted } = useIsMounted();
13 |
14 | return useMemo(
15 | () => ({
16 | permissionStatus,
17 | /**
18 | * A function that requests permissions asynchronously.
19 | *
20 | * @param {Permission[]} type - an array of permissions to request
21 | */
22 | request: async (type: Permission[]) => {
23 | if (Platform.OS === 'android') {
24 | const result = await PermissionsAndroid.requestMultiple(type);
25 |
26 | if (isMounted()) {
27 | setPermissionStatus((prevState) => ({ ...prevState, ...result }));
28 | }
29 | }
30 | },
31 | }),
32 | [isMounted, permissionStatus]
33 | );
34 | };
35 |
--------------------------------------------------------------------------------
/src/useIsMounted.ts:
--------------------------------------------------------------------------------
1 | import { useEffect, useMemo, useRef } from 'react';
2 |
3 | export const useIsMounted = () => {
4 | const mountedRef = useRef(false);
5 |
6 | useEffect(() => {
7 | mountedRef.current = true;
8 |
9 | return () => {
10 | mountedRef.current = false;
11 | };
12 | }, []);
13 |
14 | return useMemo(
15 | () => ({
16 | isMounted: () => mountedRef.current,
17 | }),
18 | []
19 | );
20 | };
21 |
--------------------------------------------------------------------------------
/src/verifyNativeModule.tsx:
--------------------------------------------------------------------------------
1 | import type { HostComponent } from 'react-native';
2 | import { NativeModules, Platform, UIManager, requireNativeComponent } from 'react-native';
3 |
4 | const LINKING_ERROR =
5 | `The package '@snap/camera-kit-react-native' doesn't seem to be linked. Make sure: \n\n` +
6 | Platform.select({ ios: "- You have run 'pod install'\n", default: '' }) +
7 | '- You rebuilt the app after installing the package\n' +
8 | '- You are not using Expo Go\n';
9 |
10 | export function getNativeViewManager(viewManagerName: string): HostComponent {
11 | return UIManager.getViewManagerConfig(viewManagerName) != null
12 | ? requireNativeComponent(viewManagerName)
13 | : (new Proxy(
14 | {},
15 | {
16 | get() {
17 | throw new Error(`View manager '${viewManagerName}' is not found. ${LINKING_ERROR}`);
18 | },
19 | }
20 | ) as HostComponent);
21 | }
22 |
23 | export function getNativeModule(moduleName: string): T {
24 | return NativeModules[moduleName]
25 | ? NativeModules[moduleName]
26 | : (new Proxy(
27 | {},
28 | {
29 | get() {
30 | throw new Error(`Module ${moduleName} is not found. ${LINKING_ERROR}`);
31 | },
32 | }
33 | ) as T);
34 | }
35 |
--------------------------------------------------------------------------------
/tsconfig.build.json:
--------------------------------------------------------------------------------
1 |
2 | {
3 | "extends": "./tsconfig",
4 | "exclude": ["example"]
5 | }
6 |
--------------------------------------------------------------------------------
/tsconfig.json:
--------------------------------------------------------------------------------
1 | {
2 | "compilerOptions": {
3 | "rootDir": ".",
4 | "paths": {
5 | "@snap/camera-kit-react-native": ["./src/index"]
6 | },
7 | "allowUnreachableCode": false,
8 | "allowUnusedLabels": false,
9 | "esModuleInterop": true,
10 | "forceConsistentCasingInFileNames": true,
11 | "jsx": "react",
12 | "lib": ["esnext"],
13 | "module": "esnext",
14 | "moduleResolution": "node",
15 | "noFallthroughCasesInSwitch": true,
16 | "noImplicitReturns": true,
17 | "noImplicitUseStrict": false,
18 | "noStrictGenericChecks": false,
19 | "noUncheckedIndexedAccess": true,
20 | "noUnusedLocals": true,
21 | "noUnusedParameters": true,
22 | "resolveJsonModule": true,
23 | "skipLibCheck": true,
24 | "strict": true,
25 | "target": "esnext",
26 | "verbatimModuleSyntax": true
27 | }
28 | }
29 |
--------------------------------------------------------------------------------
/turbo.json:
--------------------------------------------------------------------------------
1 | {
2 | "$schema": "https://turbo.build/schema.json",
3 | "pipeline": {
4 | "build:android": {
5 | "inputs": [
6 | "package.json",
7 | "android",
8 | "!android/build",
9 | "src/*.ts",
10 | "src/*.tsx",
11 | "example/package.json",
12 | "example/android",
13 | "!example/android/.gradle",
14 | "!example/android/build",
15 | "!example/android/app/build"
16 | ],
17 | "outputs": []
18 | },
19 | "build:ios": {
20 | "inputs": [
21 | "package.json",
22 | "*.podspec",
23 | "ios",
24 | "src/*.ts",
25 | "src/*.tsx",
26 | "example/package.json",
27 | "example/ios",
28 | "!example/ios/build",
29 | "!example/ios/Pods"
30 | ],
31 | "outputs": []
32 | }
33 | }
34 | }
35 |
--------------------------------------------------------------------------------
Checks if the error is a native error.
2 |