Svelte

The @apolopay-sdk/svelte package provides a native Svelte component for the SmartPay payment button.

Installation

npm install @apolopay-sdk/svelte

Usage

<script>
  import { PaymentButton } from '@apolopay-sdk/svelte';
  import { onMount } from 'svelte';

  let processId = '';

  onMount(async () => {
    // Call your backend to create a payment process
    const response = await fetch('/api/create-payment', {
      method: 'POST',
      headers: { 'Content-Type': 'application/json' },
      body: JSON.stringify({ amount: 25.50 }),
    });
    const data = await response.json();
    processId = data.processId;
  });
</script>

<h1>Complete Your Purchase</h1>
<PaymentButton
  publicKey="YOUR_PUBLIC_KEY"
  {processId}
/>

Props

Prop	Type	Required	Description
publicKey	string	✅	Your payment button's public key
processId	string	✅	The process ID from your backend

Next Steps

• Backend Integration → — Set up the preorder API call
• Webhooks → — Get notified when payments are completed