@tap-payments/connect 0.0.14-test → 0.0.15-test

package/build/@types/index.d.ts

@@ -0,0 +1,44 @@
+import { Language } from '../constants';
+export interface ConnectProps {
+    elementId: string;
+    publicKey: string;
+    domain: string;
+    language: (typeof Language)[keyof typeof Language];
+    country: string;
+    scope: string;
+    lead?: string;
+    mature: boolean;
+    board?: boolean;
+    boardMaturity?: boolean;
+    open: boolean;
+    postURL?: string;
+    onError?: (err: Error) => void;
+    onReady?: () => void;
+    onClose?: () => void;
+    onCreated?: (res: object) => void;
+    onSuccess?: (res: object) => void;
+    onBoardCompleted?: () => void;
+}
+export interface OriginalConnectProps {
+    publicKey: string;
+    open: boolean;
+    merchantDomain: string;
+    language: string;
+    appInfo: Record<string, string>;
+    businessCountryCode: string;
+    scope: string;
+    leadId?: string;
+    postURL?: string;
+    showBoard?: boolean;
+    boardMaturity?: boolean;
+    verifyToken?: string;
+    onFlowCompleted: (res: object, headers?: Record<string, string>) => void;
+    onError: (err: any) => void;
+    onStepCompleted?: (name: string, info: any) => void;
+    onReady?: () => void;
+    onStepStarted?: (name: string) => void;
+    onBoardButtonClick?: (data: Record<string, any>) => void;
+    onCreated?: (res: Record<string, any>) => void;
+    onClose?: () => void;
+    onBoardCompleted?: () => void;
+}

package/build/@types/index.js

@@ -0,0 +1 @@
+export {};

package/build/constants/index.d.ts

@@ -0,0 +1,9 @@
+export declare const CDN_LIBRARY_BASE_URL = "https://auth-jsconnect.b-cdn.net/build-2.3.46-test/";
+export declare const Maturity: {
+    readonly FULL: "full";
+    readonly EXPRESS: "express";
+};
+export declare const Language: {
+    readonly EN: "en";
+    readonly AR: "ar";
+};

package/build/constants/index.js

@@ -0,0 +1,9 @@
+export var CDN_LIBRARY_BASE_URL = 'https://auth-jsconnect.b-cdn.net/build-2.3.46-test/';
+export var Maturity = {
+    FULL: 'full',
+    EXPRESS: 'express'
+};
+export var Language = {
+    EN: 'en',
+    AR: 'ar'
+};

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

@@ -0,0 +1,5 @@
+import * as React from 'react';
+import { ConnectProps as ConnectAttrs } from '../../@types';
+export type ConnectProps = Omit<ConnectAttrs, 'elementId'>;
+export declare const TapConnect: React.MemoExoticComponent<(props: ConnectAttrs) => JSX.Element>;
+export declare const renderTapConnect: (props: ConnectProps, elementId: string) => any;

package/build/features/Connect/Connect.js

@@ -0,0 +1,65 @@
+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 { jsx as _jsx } from "react/jsx-runtime";
+import * as React from 'react';
+import { createRoot } from 'react-dom/client';
+import { findOrCreateElementAndInject, validateConnectProps } from '../../utils';
+import { useScript, useStyle } from '../../hooks';
+import { CDN_LIBRARY_BASE_URL } from '../../constants';
+import ConnectFull from './ConnectFull';
+import ConnectExpress from './ConnectExpress';
+var Connect = function (_a) {
+    var elementId = _a.elementId, props = __rest(_a, ["elementId"]);
+    useStyle("".concat(CDN_LIBRARY_BASE_URL, "/main.css"));
+    var status = useScript("".concat(CDN_LIBRARY_BASE_URL, "/main.js"));
+    React.useEffect(function () {
+        if (status === 'ready')
+            console.info('connect-auth-js is ready!');
+        if (status === 'error')
+            console.error('connect-auth-js failed to load!');
+    }, [status]);
+    if (status !== 'ready')
+        return null;
+    if (!props.mature)
+        return _jsx(ConnectExpress, __assign({}, props, { elementId: elementId }));
+    return _jsx(ConnectFull, __assign({}, props, { elementId: elementId }));
+};
+export var TapConnect = React.memo(function (props) {
+    validateConnectProps(props);
+    return _jsx(Connect, __assign({}, props));
+});
+var tapConnectInstance = null;
+export var renderTapConnect = function (props, elementId) {
+    if (tapConnectInstance) {
+        return tapConnectInstance;
+    }
+    var el = findOrCreateElementAndInject(elementId);
+    var root = createRoot(el);
+    root.render(_jsx(TapConnect, __assign({}, props, { elementId: elementId })));
+    var unmount = function () {
+        root.unmount();
+        tapConnectInstance = null;
+    };
+    tapConnectInstance = { unmount: unmount };
+    return tapConnectInstance;
+};

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

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

package/build/features/Connect/ConnectExpress.js

@@ -0,0 +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 = 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

@@ -0,0 +1,4 @@
+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

@@ -0,0 +1,13 @@
+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

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

package/build/features/Connect/index.js

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

package/build/hooks/index.d.ts

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

package/build/hooks/index.js

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

package/build/hooks/useScript.d.ts

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

package/build/hooks/useScript.js

@@ -0,0 +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;
+}

package/build/hooks/useStyle.d.ts

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

package/build/hooks/useStyle.js

@@ -0,0 +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]);
+};

package/build/index.d.ts

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

package/build/index.js

@@ -0,0 +1,7 @@
+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

@@ -0,0 +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, onBoardCompleted, boardMaturity }: ConnectProps & ExtraProps) => OriginalConnectProps;
+export {};

package/build/utils/config.js

@@ -0,0 +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, 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

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

package/build/utils/html.js

@@ -0,0 +1,9 @@
+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

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

package/build/utils/index.js

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

package/build/utils/validation.d.ts

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

package/build/utils/validation.js

@@ -0,0 +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');
+    }
+};

package/package.json

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