2.0.0 • Published 2 years ago

react-native-instapay-qr v2.0.0

Weekly downloads
-
License
MIT
Repository
github
Last release
2 years ago

React Native InstaPay QR

Package version MIT license PRs Welcome

Extract relevant data from InstaPay QR code.

Compatibility

iOSAndroidWebWindowsmacOS
Expo:white_check_mark::white_check_mark::white_check_mark::no_entry_sign::no_entry_sign:
Native:white_check_mark::white_check_mark::white_check_mark::x::x:

Installation

yarn add react-native-instapay-qr
npx pod-install # iOS Only

Android

Add the following to your AndroidManifest.xml:

<uses-permission android:name="android.permission.CAMERA" />

iOS

Add the following to your Info.plist:

<key>NSCameraUsageDescription</key>
<string/>

Installation (Expo)

expo install react-native-instapay-qr expo-camera expo-barcode-scanner
npx pod-install # iOS Only

:bulb: If you use the Expo managed workflow you will see "CocoaPods is not supported in this project" - this is fine, it's not necessary.

Usage

import { useState } from 'react';
import InstaPayQr from 'react-native-instapay-qr';

function App() {
  const [scanning, setScanning] = useState(true);

  const onRead = (data, errors) {
    if (errors.length > 0) return;

    console.log(data);
    setScanning(false);
  };

  return (
    <InstaPayQr
      style={{ height: 300, width: 300 }}
      cameraStyle={{ flex: 1 }}
      onRead={onRead}
      scanning={scanning}
    />
  );
}

Response Data

{
  countryCode: 'PH',
  city: 'Makati',
  name: 'Account Name',
  accountNumber: 'XXXXXXXXXXXX',
  swiftCode: 'UBPHPHMMXXX',
  bankName: 'UNION BANK OF THE PHILIPPINES',
}

Props

AttributeTypeDefault
styleReact Native Style{}
cameraStyleReact Native Style{}
onReadFunction() => null
scanningBooleantrue
childrenNodenull

Upgrading

See UPGRADING.md

Changelogs

See CHANGELOGS.md

Contributing

See CONTRIBUTING.md

License

Copyright © 2022 David Angulo, released under the MIT license, see LICENSE.