@tongo_fintech/react-broker-signup-integration

React library for broker signup with Tongo using signup tokens.

Installation

npm install @tongo_fintech/react-broker-signup-integration

react and react-dom are peer dependencies and must already exist in the host app.

Quick Start

import { useBrokerSignupIntegration } from '@tongo_fintech/react-broker-signup-integration';

function Example() {
  const { open, close, isOpen } = useBrokerSignupIntegration({
    environment: 'production',
    onSuccess: () => {
      console.log('signup success');
    },
    onError: ({ message }) => {
      console.error(message);
    },
    onClose: (reason) => {
      console.log('closed because:', reason);
    },
  });

  return (
    <div>
      <button onClick={() => open('signup-token')} type="button">
        Open signup
      </button>
      {isOpen ? (
        <button onClick={() => close()} type="button">
          Close from app
        </button>
      ) : null}
    </div>
  );
}

API

useBrokerSignupIntegration(options)

Returns:

• open(signupToken: string)
• close(reason?: 'overlay' | 'escape' | 'iframe' | 'api')
• isOpen: boolean

Options:

• environment: 'develop' | 'production'
• modal: optional modal customization
• onSuccess: called when iframe posts { event: 'SUCCESS' } and does not close the modal
• onError: called when iframe posts { event: 'ERROR', message: string }
• onClose: called when the modal closes

What The Library Renders

• A fullscreen dark backdrop
• A white rounded modal shell
• A full-size iframe inside the shell