This library provides payment card scanning functionality for your react-native app

• Installation
• Usage
• Run example project
• Available props
• Available methods
• Contributing
• License
• Original SDK

using either Yarn:

yarn add rn-card-scanner

or npm:

npm install --save rn-card-scanner

React Native 0.60 and above

CLI autolink feature links the module while building the app.

Note For iOS using cocoapods, run:

$ cd ios/ && pod install

React Native 0.59 and below

Run react-native link rn-card-scanner to link the rn-card-scanner library. After following the instructions for your platform to link rn-card-scanner into your project:

 pod 'RNCardScanner', :path => '../node_modules/rn-card-scanner'

include ':reactnativecardscanner'
project(':reactnativecardscanner').projectDir = new File(rootProject.projectDir, '../node_modules/rn-card-scanner/android')

dependencies {
   ...
+    implementation project(':reactnativecardscanner')
}

android.useAndroidX=true
android.enableJetifier=true

import com.reactnativecardscanner.CardScannerPackage;

@Override
protected List<ReactPackage> getPackages() {
    return Arrays.asList(
            new MainReactPackage(),
            new CardScannerPackage()
    );
}

import CardScanner from 'rn-card-scanner';

<CardScanner
  style={{ flex: 1 }}
  didCardScan={(response) => {
    console.log('Card info: ', response);
  }}
/>

Running the example project:

1. Checkout this repository.
2. Go to example directory and run yarn or npm i
3. Go to example/ios and install Pods with pod install
4. Run app

• To run Android app: npx react-native run-android
• To run iOS app: npx react-native run-ios

• Includes all React Native View props.

const cardScannerRef = useRef(null)

<CardScanner
  //Other props
  ref={cardScannerRef}
/>

//Ex: Toggle flash on and off
onPress={() => cardScannerRef.current.toggleFlash()}

An object with the following keys:

• cardNumber - Card number.
• expiryMonth - Expiry month.
• expiryYear - Expiry year.
• holderName - Card holder name.

While building your iOS project, you may see a Undefined symbols for architecture x86_64 error. This is caused by react-native init template configuration that is not fully compatible with Swift.

Undefined symbols for architecture x86_64:
    "_swift_FORCE_LOAD...
    ld: symbol(s) not found for architecture x86_64

Follow these steps to resolve this:

• Open your project via Xcode.
• Create a new Swift file to the project (File > New > File > Swift), give it any name (e.g. File.swift) and answer "yes" when Xcode asks you if you want to "Create Bridging Header"
• Clean build and run app

See the contributing guide to learn how to contribute to the repository and the development workflow.

MIT

Android - iOS