@tap-payments/connect 1.0.0 → 1.0.1

package/build/features/Connect/ConnectExpress.js

@@ -1,76 +1,90 @@
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-import * as React from 'react';
-import { wrapLibConfig } from '../../utils';
-var ConnectExpress = function (props) {
-    var _a = React.useState(''), token = _a[0], setToken = _a[1];
-    var _b = React.useState('express'), name = _b[0], setName = _b[1];
-    var onButtonClick = function (_a) {
-        var name = _a.name, token = _a.token;
-        setToken(token);
-        setName(name);
-    };
-    var _c = window['TapAuth'], renderConnectExpressLib = _c.renderConnectExpressLib, renderIndividualLib = _c.renderIndividualLib, renderBankLib = _c.renderBankLib, renderTaxLib = _c.renderTaxLib, renderEntityLib = _c.renderEntityLib, renderBrandLib = _c.renderBrandLib;
-    var elementId = 'tap-connect-sdk-lib';
-    React.useEffect(function () {
-        console.log('rendering: ', name);
-        var config = wrapLibConfig(__assign(__assign({}, props), { verifyToken: token, onBoardButtonClick: onButtonClick }));
-        switch (name) {
-            case 'brand':
-                renderBrandLib(config, elementId);
-                break;
-            case 'tax':
-                renderTaxLib(config, elementId);
-                break;
-            case 'bank':
-                renderBankLib(config, elementId);
-                break;
-            case 'individual':
-                renderIndividualLib(config, elementId);
-                break;
-            case 'entity':
-                renderEntityLib(config, elementId);
-                break;
-            default:
-                var onSuccess = props.onSuccess, rest = __rest(props, ["onSuccess"]);
-                var configAttrs = wrapLibConfig(__assign(__assign({}, rest), { verifyToken: token, onBoardButtonClick: onButtonClick }));
-                renderConnectExpressLib(configAttrs, elementId);
-                break;
-        }
-    }, [
-        name,
-        token,
-        renderConnectExpressLib,
-        renderIndividualLib,
-        renderBankLib,
-        renderTaxLib,
-        renderEntityLib,
-        renderBrandLib,
-        props,
-        elementId,
-        onButtonClick,
-        wrapLibConfig
-    ]);
-    return null;
-};
-export default React.memo(ConnectExpress);
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import * as React from 'react';
+import { wrapLibConfig } from '../../utils';
+var ConnectExpress = function (props) {
+    var _a = React.useState(''), token = _a[0], setToken = _a[1];
+    var _b = React.useState('express'), name = _b[0], setName = _b[1];
+    var onButtonClick = function (_a) {
+        var name = _a.name, token = _a.token;
+        setToken(token);
+        setName(name);
+    };
+    var _c = window['TapAuth'], renderConnectExpressLib = _c.renderConnectExpressLib, renderIndividualLib = _c.renderIndividualLib, renderBankLib = _c.renderBankLib, renderTaxLib = _c.renderTaxLib, renderEntityLib = _c.renderEntityLib, renderBrandLib = _c.renderBrandLib;
+    var elementId = props.elementId;
+    var unmountComponent = function () { };
+    React.useEffect(function () {
+        console.log('rendering: ', name);
+        var config = wrapLibConfig(__assign(__assign({}, props), { verifyToken: token, onBoardButtonClick: onButtonClick }));
+        switch (name) {
+            case 'brand':
+                unmountComponent();
+                var unmountBrand = renderBrandLib(config, elementId).unmount;
+                unmountComponent = unmountBrand;
+                break;
+            case 'tax':
+                unmountComponent();
+                var unmountTax = renderTaxLib(config, elementId).unmount;
+                unmountComponent = unmountTax;
+                break;
+            case 'bank':
+                unmountComponent();
+                var unmountBank = renderBankLib(config, elementId).unmount;
+                unmountComponent = unmountBank;
+                break;
+            case 'individual':
+                unmountComponent();
+                var unmountIndiv = renderIndividualLib(config, elementId).unmount;
+                unmountComponent = unmountIndiv;
+                break;
+            case 'entity':
+                unmountComponent();
+                var unmountEntity = renderEntityLib(config, elementId).unmount;
+                unmountComponent = unmountEntity;
+                break;
+            default:
+                unmountComponent();
+                var onSuccess = props.onSuccess, rest = __rest(props, ["onSuccess"]);
+                var configAttrs = wrapLibConfig(__assign(__assign({}, rest), { verifyToken: token, onBoardButtonClick: onButtonClick }));
+                var unmountExpress = renderConnectExpressLib(configAttrs, elementId).unmount;
+                unmountComponent = unmountExpress;
+                break;
+        }
+        return function () { return unmountComponent(); };
+    }, [
+        name,
+        token,
+        renderConnectExpressLib,
+        renderIndividualLib,
+        renderBankLib,
+        renderTaxLib,
+        renderEntityLib,
+        renderBrandLib,
+        props,
+        elementId,
+        onButtonClick,
+        wrapLibConfig
+    ]);
+    return null;
+};
+export default React.memo(ConnectExpress);

package/build/features/Connect/ConnectFull.d.ts

@@ -1,4 +1,4 @@
-import * as React from 'react';
-import { ConnectProps } from '../../@types';
-declare const _default: React.MemoExoticComponent<(props: ConnectProps) => null>;
-export default _default;
+import * as React from 'react';
+import { ConnectProps } from '../../@types';
+declare const _default: React.MemoExoticComponent<(props: ConnectProps) => null>;
+export default _default;

package/build/features/Connect/ConnectFull.js

@@ -1,12 +1,13 @@
-import * as React from 'react';
-import { wrapLibConfig } from '../../utils';
-var ConnectFull = function (props) {
-    var renderConnectLib = window['TapAuth'].renderConnectLib;
-    var id = 'tap-connect-sdk-lib';
-    React.useEffect(function () {
-        var config = wrapLibConfig(props);
-        renderConnectLib(config, id);
-    }, [renderConnectLib, props]);
-    return null;
-};
-export default React.memo(ConnectFull);
+import * as React from 'react';
+import { wrapLibConfig } from '../../utils';
+var ConnectFull = function (props) {
+    var renderConnectLib = window['TapAuth'].renderConnectLib;
+    var id = props.elementId;
+    React.useEffect(function () {
+        var config = wrapLibConfig(props);
+        var unmount = renderConnectLib(config, id).unmount;
+        return function () { return unmount(); };
+    }, [renderConnectLib, props]);
+    return null;
+};
+export default React.memo(ConnectFull);

package/build/features/Connect/index.d.ts

@@ -1,3 +1,3 @@
-import { TapConnect, ConnectProps as TapConnectProps, renderTapConnect } from './Connect';
-export type { TapConnectProps };
-export { TapConnect, renderTapConnect };
+import { TapConnect, ConnectProps as TapConnectProps, renderTapConnect } from './Connect';
+export type { TapConnectProps };
+export { TapConnect, renderTapConnect };

package/build/features/Connect/index.js

@@ -1,2 +1,2 @@
-import { TapConnect, renderTapConnect } from './Connect';
-export { TapConnect, renderTapConnect };
+import { TapConnect, renderTapConnect } from './Connect';
+export { TapConnect, renderTapConnect };

package/build/hooks/index.d.ts

@@ -1,2 +1,2 @@
-export * from './useScript';
-export * from './useStyle';
+export * from './useScript';
+export * from './useStyle';

package/build/hooks/index.js

@@ -1,2 +1,2 @@
-export * from './useScript';
-export * from './useStyle';
+export * from './useScript';
+export * from './useStyle';

package/build/hooks/useScript.d.ts

@@ -1 +1 @@
-export declare function useScript(src: string, async?: boolean): "ready" | "loading" | "idle" | "error";
+export declare function useScript(src: string, async?: boolean): "ready" | "loading" | "idle" | "error";

package/build/hooks/useScript.js

@@ -1,39 +1,39 @@
-import { useEffect, useState } from 'react';
-export function useScript(src, async) {
-    if (async === void 0) { async = true; }
-    var _a = useState(src ? 'loading' : 'idle'), status = _a[0], setStatus = _a[1];
-    useEffect(function () {
-        if (!src) {
-            setStatus('idle');
-            return;
-        }
-        var script = document.querySelector("script[src=\"".concat(src, "\"]"));
-        if (!script) {
-            script = document.createElement('script');
-            script.src = src;
-            script.async = async;
-            script.setAttribute('data-status', 'loading');
-            document.body.appendChild(script);
-            var setAttributeFromEvent = function (event) {
-                script.setAttribute('data-status', event.type === 'load' ? 'ready' : 'error');
-            };
-            script.addEventListener('load', setAttributeFromEvent);
-            script.addEventListener('error', setAttributeFromEvent);
-        }
-        else {
-            setStatus(script.getAttribute('data-status'));
-        }
-        var setStateFromEvent = function (event) {
-            setStatus(event.type === 'load' ? 'ready' : 'error');
-        };
-        script.addEventListener('load', setStateFromEvent);
-        script.addEventListener('error', setStateFromEvent);
-        return function () {
-            if (script) {
-                script.removeEventListener('load', setStateFromEvent);
-                script.removeEventListener('error', setStateFromEvent);
-            }
-        };
-    }, [src]);
-    return status;
-}
+import { useEffect, useState } from 'react';
+export function useScript(src, async) {
+    if (async === void 0) { async = true; }
+    var _a = useState(src ? 'loading' : 'idle'), status = _a[0], setStatus = _a[1];
+    useEffect(function () {
+        if (!src) {
+            setStatus('idle');
+            return;
+        }
+        var script = document.querySelector("script[src=\"".concat(src, "\"]"));
+        if (!script) {
+            script = document.createElement('script');
+            script.src = src;
+            script.async = async;
+            script.setAttribute('data-status', 'loading');
+            document.body.appendChild(script);
+            var setAttributeFromEvent = function (event) {
+                script.setAttribute('data-status', event.type === 'load' ? 'ready' : 'error');
+            };
+            script.addEventListener('load', setAttributeFromEvent);
+            script.addEventListener('error', setAttributeFromEvent);
+        }
+        else {
+            setStatus(script.getAttribute('data-status'));
+        }
+        var setStateFromEvent = function (event) {
+            setStatus(event.type === 'load' ? 'ready' : 'error');
+        };
+        script.addEventListener('load', setStateFromEvent);
+        script.addEventListener('error', setStateFromEvent);
+        return function () {
+            if (script) {
+                script.removeEventListener('load', setStateFromEvent);
+                script.removeEventListener('error', setStateFromEvent);
+            }
+        };
+    }, [src]);
+    return status;
+}

package/build/hooks/useStyle.d.ts

@@ -1 +1 @@
-export declare const useStyle: (url: string) => void;
+export declare const useStyle: (url: string) => void;

package/build/hooks/useStyle.js

@@ -1,13 +1,13 @@
-import { useEffect } from 'react';
-export var useStyle = function (url) {
-    useEffect(function () {
-        var link = document.createElement('link');
-        link.href = url;
-        link.rel = 'stylesheet';
-        link.type = 'text/css';
-        document.head.appendChild(link);
-        return function () {
-            document.head.removeChild(link);
-        };
-    }, [url]);
-};
+import { useEffect } from 'react';
+export var useStyle = function (url) {
+    useEffect(function () {
+        var link = document.createElement('link');
+        link.href = url;
+        link.rel = 'stylesheet';
+        link.type = 'text/css';
+        document.head.appendChild(link);
+        return function () {
+            document.head.removeChild(link);
+        };
+    }, [url]);
+};

package/build/index.d.ts

@@ -1,4 +1,4 @@
-import { TapConnect, TapConnectProps, renderTapConnect } from './features/Connect';
-import { Language } from './constants';
-export type { TapConnectProps };
-export { Language, TapConnect, renderTapConnect };
+import { TapConnect, TapConnectProps, renderTapConnect } from './features/Connect';
+import { Language } from './constants';
+export type { TapConnectProps };
+export { Language, TapConnect, renderTapConnect };

package/build/index.js

@@ -1,7 +1,7 @@
-import { TapConnect, renderTapConnect } from './features/Connect';
-import { Language } from './constants';
-export { Language, TapConnect, renderTapConnect };
-window['TapPayments'] = {
-    renderTapConnect: renderTapConnect,
-    Language: Language
-};
+import { TapConnect, renderTapConnect } from './features/Connect';
+import { Language } from './constants';
+export { Language, TapConnect, renderTapConnect };
+window['TapPayments'] = {
+    renderTapConnect: renderTapConnect,
+    Language: Language
+};

package/build/utils/config.d.ts

@@ -1,7 +1,7 @@
-import { ConnectProps, OriginalConnectProps } from '../@types';
-type ExtraProps = {
-    verifyToken?: string;
-    onBoardButtonClick?: (data: Record<string, string>) => void;
-};
-export declare const wrapLibConfig: ({ publicKey, open, language, country, scope, lead, postURL, onError, onReady, onSuccess, board, verifyToken, domain, onBoardButtonClick, onClose, onCreated }: ConnectProps & ExtraProps) => OriginalConnectProps;
-export {};
+import { ConnectProps, OriginalConnectProps } from '../@types';
+type ExtraProps = {
+    verifyToken?: string;
+    onBoardButtonClick?: (data: Record<string, string>) => void;
+};
+export declare const wrapLibConfig: ({ publicKey, open, language, country, scope, lead, postURL, onError, onReady, onSuccess, board, verifyToken, domain, onBoardButtonClick, onClose, onCreated, onBoardCompleted, boardMaturity }: ConnectProps & ExtraProps) => OriginalConnectProps;
+export {};

package/build/utils/config.js

@@ -1,38 +1,42 @@
-export var wrapLibConfig = function (_a) {
-    var publicKey = _a.publicKey, open = _a.open, language = _a.language, country = _a.country, scope = _a.scope, lead = _a.lead, postURL = _a.postURL, onError = _a.onError, onReady = _a.onReady, onSuccess = _a.onSuccess, board = _a.board, verifyToken = _a.verifyToken, domain = _a.domain, onBoardButtonClick = _a.onBoardButtonClick, onClose = _a.onClose, onCreated = _a.onCreated;
-    return {
-        appInfo: {
-            name: window.location.hostname
-        },
-        businessCountryCode: country,
-        language: language,
-        merchantDomain: domain,
-        open: open,
-        postURL: postURL,
-        publicKey: publicKey,
-        scope: scope,
-        leadId: lead,
-        showBoard: board,
-        verifyToken: verifyToken,
-        onFlowCompleted: function (res) {
-            onSuccess && onSuccess(res);
-        },
-        onError: function (err) {
-            onError && onError(err);
-        },
-        onReady: function () {
-            onReady && onReady();
-        },
-        onBoardButtonClick: function (data) {
-            onBoardButtonClick && onBoardButtonClick(data);
-        },
-        onCreated: function (res) {
-            onCreated && onCreated(res);
-        },
-        onClose: function () {
-            onClose && onClose();
-        },
-        onStepCompleted: function (name, info) { },
-        onStepStarted: function (name) { }
-    };
-};
+export var wrapLibConfig = function (_a) {
+    var publicKey = _a.publicKey, open = _a.open, language = _a.language, country = _a.country, scope = _a.scope, lead = _a.lead, postURL = _a.postURL, onError = _a.onError, onReady = _a.onReady, onSuccess = _a.onSuccess, board = _a.board, verifyToken = _a.verifyToken, domain = _a.domain, onBoardButtonClick = _a.onBoardButtonClick, onClose = _a.onClose, onCreated = _a.onCreated, onBoardCompleted = _a.onBoardCompleted, boardMaturity = _a.boardMaturity;
+    return {
+        appInfo: {
+            name: window.location.hostname || window.location.origin
+        },
+        businessCountryCode: country,
+        language: language,
+        merchantDomain: domain,
+        open: open,
+        postURL: postURL,
+        publicKey: publicKey,
+        scope: scope,
+        leadId: lead,
+        showBoard: board,
+        boardMaturity: boardMaturity,
+        verifyToken: verifyToken,
+        onFlowCompleted: function (res) {
+            onSuccess && onSuccess(res);
+        },
+        onError: function (err) {
+            onError && onError(err);
+        },
+        onReady: function () {
+            onReady && onReady();
+        },
+        onBoardButtonClick: function (data) {
+            onBoardButtonClick && onBoardButtonClick(data);
+        },
+        onCreated: function (res) {
+            onCreated && onCreated(res);
+        },
+        onClose: function () {
+            onClose && onClose();
+        },
+        onBoardCompleted: function () {
+            onBoardCompleted && onBoardCompleted();
+        },
+        onStepCompleted: function (name, info) { },
+        onStepStarted: function (name) { }
+    };
+};

package/build/utils/html.d.ts

@@ -1 +1 @@
-export declare const createElementAndInject: (id: string) => HTMLDivElement;
+export declare const findOrCreateElementAndInject: (id: string) => HTMLElement;

package/build/utils/html.js

@@ -1,6 +1,9 @@
-export var createElementAndInject = function (id) {
-    var element = document.createElement('div');
-    element.setAttribute('id', id || 'tap-connect-sdk-lib');
-    document.body.prepend(element);
-    return element;
-};
+export var findOrCreateElementAndInject = function (id) {
+    var elementExist = document.getElementById(id);
+    if (elementExist)
+        return elementExist;
+    var element = document.createElement('div');
+    element.setAttribute('id', id || 'tap-connect-sdk-lib');
+    document.body.prepend(element);
+    return element;
+};

package/build/utils/index.d.ts

@@ -1,3 +1,3 @@
-export * from './html';
-export * from './validation';
-export * from './config';
+export * from './html';
+export * from './validation';
+export * from './config';

package/build/utils/index.js

@@ -1,3 +1,3 @@
-export * from './html';
-export * from './validation';
-export * from './config';
+export * from './html';
+export * from './validation';
+export * from './config';

package/build/utils/validation.d.ts

@@ -1,2 +1,2 @@
-import { ConnectProps } from '../@types';
-export declare const validateConnectProps: (props: ConnectProps) => void;
+import { ConnectProps } from '../@types';
+export declare const validateConnectProps: (props: ConnectProps) => void;

package/build/utils/validation.js

@@ -1,52 +1,52 @@
-import { Language } from '../constants';
-export var validateConnectProps = function (props) {
-    var publicKey = props.publicKey, mature = props.mature, country = props.country, language = props.language, scope = props.scope, open = props.open, domain = props.domain, board = props.board, lead = props.lead, onClose = props.onClose, onCreated = props.onCreated, onError = props.onError, onReady = props.onReady, onSuccess = props.onSuccess, postURL = props.postURL;
-    if (!publicKey) {
-        throw new Error('publicKey is required');
-    }
-    if (!country) {
-        throw new Error('country is required');
-    }
-    if (!language) {
-        throw new Error('language is required');
-    }
-    if (![Language.AR, Language.EN].includes(language)) {
-        throw new Error('You can only use AR or EN for language');
-    }
-    if (!scope) {
-        throw new Error('scope is required');
-    }
-    if (!domain) {
-        throw new Error('domain is required');
-    }
-    if (typeof open !== 'boolean') {
-        throw new Error('open is required, and must be a boolean');
-    }
-    if (typeof mature !== 'boolean') {
-        throw new Error('mature is required, and must be a boolean');
-    }
-    if (typeof board !== 'undefined' && typeof board !== 'boolean') {
-        throw new Error('board is required, and must be a boolean');
-    }
-    if (typeof lead !== 'undefined' && typeof lead !== 'string') {
-        throw new Error('lead must be a string');
-    }
-    if (typeof postURL !== 'undefined' && typeof postURL !== 'string') {
-        throw new Error('postURL must be a string');
-    }
-    if (typeof onClose !== 'undefined' && typeof onClose !== 'function') {
-        throw new Error('onClose must be a function');
-    }
-    if (typeof onCreated !== 'undefined' && typeof onCreated !== 'function') {
-        throw new Error('onCreated must be a function');
-    }
-    if (typeof onError !== 'undefined' && typeof onError !== 'function') {
-        throw new Error('onError must be a function');
-    }
-    if (typeof onReady !== 'undefined' && typeof onReady !== 'function') {
-        throw new Error('onReady must be a function');
-    }
-    if (typeof onSuccess !== 'undefined' && typeof onSuccess !== 'function') {
-        throw new Error('onSuccess must be a function');
-    }
-};
+import { Language } from '../constants';
+export var validateConnectProps = function (props) {
+    var publicKey = props.publicKey, mature = props.mature, country = props.country, language = props.language, scope = props.scope, open = props.open, domain = props.domain, board = props.board, lead = props.lead, onClose = props.onClose, onCreated = props.onCreated, onError = props.onError, onReady = props.onReady, onSuccess = props.onSuccess, postURL = props.postURL;
+    if (!publicKey) {
+        throw new Error('publicKey is required');
+    }
+    if (!country) {
+        throw new Error('country is required');
+    }
+    if (!language) {
+        throw new Error('language is required');
+    }
+    if (![Language.AR, Language.EN].includes(language)) {
+        throw new Error('You can only use AR or EN for language');
+    }
+    if (!scope) {
+        throw new Error('scope is required');
+    }
+    if (!domain) {
+        throw new Error('domain is required');
+    }
+    if (typeof open !== 'boolean') {
+        throw new Error('open is required, and must be a boolean');
+    }
+    if (typeof mature !== 'boolean') {
+        throw new Error('mature is required, and must be a boolean');
+    }
+    if (typeof board !== 'undefined' && typeof board !== 'boolean') {
+        throw new Error('board is required, and must be a boolean');
+    }
+    if (typeof lead !== 'undefined' && typeof lead !== 'string') {
+        throw new Error('lead must be a string');
+    }
+    if (typeof postURL !== 'undefined' && typeof postURL !== 'string') {
+        throw new Error('postURL must be a string');
+    }
+    if (typeof onClose !== 'undefined' && typeof onClose !== 'function') {
+        throw new Error('onClose must be a function');
+    }
+    if (typeof onCreated !== 'undefined' && typeof onCreated !== 'function') {
+        throw new Error('onCreated must be a function');
+    }
+    if (typeof onError !== 'undefined' && typeof onError !== 'function') {
+        throw new Error('onError must be a function');
+    }
+    if (typeof onReady !== 'undefined' && typeof onReady !== 'function') {
+        throw new Error('onReady must be a function');
+    }
+    if (typeof onSuccess !== 'undefined' && typeof onSuccess !== 'function') {
+        throw new Error('onSuccess must be a function');
+    }
+};

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@tap-payments/connect",
-	"version": "1.0.0",
+	"version": "1.0.1",
 	"description": "Tap Connect",
 	"main": "build/index.js",
 	"module": "build/index.js",