Boompay-react-native-sdk NPM

boompay-react-native-sdk

Boom React Native SDK for partners. Want to partner with us? Click here!

Installation

This library depends on react-native-webview and you will have to install it first. See react-native-webview installation guide.

npm install boompay-react-native-sdk

yarn add boompay-react-native-sdk

Basic Usage

import { BoomView } from 'boompay-react-native-sdk';

export const YourComponent = () => {
  const token = '';

  const onClose = () => {
    // handle close here.
    // Sample usage could be something like this:
    navigator.navigate('/other_screen');
  };

  return (
    <BoomView
      token={token}
      primaryColor="#FFC8D0"
      secondaryColor="#171717"
      logoUri="https://path.to/your/logo/url"
      onClose={onClose}
    />
  );
};

We recommend wrapping this component into SafeArea

export default function App() {
  const token = '';

  const onClose = () => {
    // handle close here.
    // Sample usage could be something like this:
    navigator.navigate('/other_screen');
  };

  if (token) {
    return (
      <SafeAreaView style={styles.fullScreen}>
        <View style={styles.fullScreen}>
          <BoomView
            token={token}
            primaryColor="#FFC8D0"
            secondaryColor="#171717"
            theme="dark"
            logoUri="https://path.to/your/logo/url"
            onClose={onClose}
          />
        </View>
      </SafeAreaView>
    );
  }
}

const styles = StyleSheet.create({
  fullScreen: {
    flex: 1,
  },
});

Props

	type	description	required	default
token	string	user auth token	✅
primaryColor	string	HEX	✅
secondaryColor	string	HEX	✅
logoUri	string	public link to your logo	✅
theme	enum	"light" \| "dark"	❌	"dark"
sandboxMode	boolean	toggle between prod and sandbox	❌	true
onClose	() => void \| unknown	use to handle close WebView flow	✅
onMessage	(msg: "authError") => void \| unknown	triggered when invalid token passed	❌