Embed button

One script tag + one button. Opens the hosted consent flow in a popup, posts the result back to your page, and dispatches a ucap:result event.

<script src="https://notify.ucap.africa/embed/button.js" async></script>

<button data-ucap-apply
        data-ucap-client="pub_8a4f..."
        data-ucap-product="prd_8a4f..."
        data-ucap-ref="loan_app_42">
  Apply with UCAP
</button>

<script>
  document.querySelector('[data-ucap-apply]').addEventListener('ucap:result', (e) => {
    console.log(e.detail); // { source: 'ucap', session_id, status }
  });
</script>

data-ucap-applyrequired

Marks the trigger element.

data-ucap-clientrequired

Your public client id (pub_...). Safe to expose on the web.

data-ucap-productrequired

The product the consumer is consenting to.

data-ucap-ref

Your own correlation id — returned on webhooks and the data endpoint.

data-ucap-callback

Name of a global function called with { session_id, status }.

Origin allowlist

Every public client is locked to a list of origins you configure in the partner portal. Requests from any other origin are rejected before a session is created — so this snippet is safe to drop on any of your own properties, and nowhere else.