Embed the checkout

npm install @kwugwo/checkout

<script src="https://cdn.jsdelivr.net/npm/@kwugwo/checkout"></script>

import { KwugwoCheckout } from '@kwugwo/checkout';

const checkout = KwugwoCheckout.init({
    publicKey: 'pk.VCvr.iemkSYEKZlpPqUEoeHLqEmvbHPln4JnyNBehFnATM3GzpcMILEUjNPJSpyMuYc13JiByfYohiCPPlwnu'
});

document.getElementById('pay').addEventListener('click', async () => {
    // 1. Your backend creates the ugwo and returns its uid
    const { ugwoUid } = await fetch('/checkout/create', { method: 'POST' }).then(r => r.json());

    // 2. Open the checkout overlay
    const result = await checkout.open({
        ugwoUid,
        returnUrl: 'https://merchant.com/thanks',
        onSuccess: ({ activityUid }) => console.log('Paid', activityUid),
        onClose:   () => console.log('User closed the modal'),
        onError:   (e) => console.error(e.code, e.message),
    });

    // result is { type: 'success' | 'closed' | 'error', ... }
});

<script src="https://cdn.jsdelivr.net/npm/@kwugwo/checkout"></script>
<script>
    var checkout = KwugwoCheckout.init({
        publicKey: 'pk.VCvr.iemkSYEKZlpPqUEoeHLqEmvbHPln4JnyNBehFnATM3GzpcMILEUjNPJSpyMuYc13JiByfYohiCPPlwnu'
    });

    document.getElementById('pay').onclick = function () {
        checkout.open({
            ugwoUid: 'ugw.VCvr.qnbBJaElzSTHOcaTzxbuDlIs',
            onSuccess: function (r) { console.log('paid', r); }
        });
    };
</script>