payhere-embed-sdk/dist/react.js

payhere.co embed widget

'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var React = require('react');
var ReactDOM = require('react-dom');

function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }

var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
var ReactDOM__default = /*#__PURE__*/_interopDefaultLegacy(ReactDOM);

var styles = {"embedContainer":"embed-module_embedContainer__2q9Md","embedModal":"embed-module_embedModal__3rP2H","embedIframe":"embed-module_embedIframe__30Rog","ldsRing":"embed-module_ldsRing__14Ml-","lds-ring":"embed-module_lds-ring__2UST5"};

var PayhereEmbed = function (_a) {
    var open = _a.open, selector = _a.selector, embedURL = _a.embedURL, customerName = _a.customerName, customerEmail = _a.customerEmail, disableCustomer = _a.disableCustomer, amountInCents = _a.amountInCents, hideAmount = _a.hideAmount, customFields = _a.customFields, onSuccess = _a.onSuccess, onFailure = _a.onFailure, onClose = _a.onClose;
    var _b = React.useState(true), isLoading = _b[0], setLoading = _b[1];
    // Don't load in non browser context
    if (typeof window === "undefined")
        return null;
    var origin = window.location.origin;
    var customFieldsStr = customFields ? btoa(JSON.stringify(customFields)) : "";
    customerEmail = customerEmail ? encodeURIComponent(customerEmail) : "";
    var onMessage = React.useCallback(function (e) {
        switch (e.data.message) {
            case "payhere:ready":
                setLoading(false);
                break;
            case "payhere:success":
                var data_1 = e.data.content;
                onSuccess(data_1);
                if (data_1.plan &&
                    data_1.plan.success_url &&
                    data_1.plan.success_url.length > 0) {
                    console.log("Redirecting to " + data_1.plan.success_url);
                    setTimeout(function () {
                        window.location.href = data_1.plan.success_url;
                    }, 2000);
                }
                break;
            case "payhere:failure":
                onFailure(e.data.content);
                break;
            case "payhere:close":
                onClose();
                setLoading(true);
                break;
        }
    }, [onSuccess, onFailure, onClose]);
    React.useEffect(function () {
        window.addEventListener("message", onMessage, false);
        return function () { return window.removeEventListener("message", onMessage, false); };
    });
    if (!open)
        return null;
    var element = document.querySelector(selector);
    if (!element) {
        console.error("Payhere embed SDK: Element not found with selector '" + selector + "'");
        return null;
    }
    return ReactDOM__default['default'].createPortal(React__default['default'].createElement("div", { className: styles.embedContainer },
        isLoading && (React__default['default'].createElement("div", { className: styles.ldsRing },
            React__default['default'].createElement("div", null),
            React__default['default'].createElement("div", null),
            React__default['default'].createElement("div", null),
            React__default['default'].createElement("div", null))),
        React__default['default'].createElement("div", { className: styles.embedModal, style: { transform: isLoading ? "scale(0)" : "scale(1)" } },
            React__default['default'].createElement("iframe", { className: styles.embedIframe, src: embedURL + "?embedded=yes&embed_origin=" + origin + "&customer_name=" + (customerName || "") + "&customer_email=" + (customerEmail || "") + "&disable_customer_fields=" + (disableCustomer || "no") + "&hide_amount=" + (hideAmount || "no") + "&amount_in_cents=" + (amountInCents || "") + "&custom_fields=" + customFieldsStr }))), element);
};

exports.default = PayhereEmbed;
//# sourceMappingURL=react.js.map