render

render()

Renders the payment button and returns the DOM element.

Syntax

button.render()

Returns

  • Type: HTMLButtonElement

  • Description: The button DOM element ready to be inserted into the page

Usage

Plain JavaScript:

const button = new ButtonDynamicPrice({
  price: 49.99,
  apiKey: "your_api_key"
});

// Get the button element
const buttonElement = button.render();

// Append to page
document.getElementById('payment-container').appendChild(buttonElement);

React:

import { useEffect, useRef } from 'react';
import { ButtonDynamicPrice } from 'kirapay-merchant-sdk';

function PaymentButton() {
  const buttonRef = useRef(null);
  const buttonInstance = useRef(null);

  useEffect(() => {
    buttonInstance.current = new ButtonDynamicPrice({
      price: 49.99,
      apiKey: process.env.NEXT_PUBLIC_KIRAPAY_API_KEY
    });

    if (buttonRef.current) {
      buttonRef.current.appendChild(buttonInstance.current.render());
    }

    return () => {
      if (buttonInstance.current) {
        buttonInstance.current.destroy();
      }
    };
  }, []);

  return <div ref={buttonRef}></div>;
}

Last updated

Was this helpful?