Skip to main content

Overview

When users interact with the Holdstation Pay Widget embedded on a partner’s site, the partner must pass a unique identifier called Partner Key into the widget (provided by Holdstation). This ensures that all transactions are accurately attributed to that partner, supporting revenue-sharing calculations and tracking transaction volume.

Integration Mechanism

1

Widget Loads

When the widget is fully loaded and ready, it emits a PAY_HOLDSTATION_START event.
2

Partner Responds

The partner’s website listens for this event and immediately sends back a SET_PARTNER_KEY message containing the Partner ID.

React Example

const ref = useRef(null);

useEffect(() => {
    const handleMessage = (event) => {
        // Listen for the widget ready event
        if (event.data?.type === 'PAY_HOLDSTATION_START') {
            // Send partner key back to the widget
            ref.current?.contentWindow?.postMessage(
                {
                    type: 'SET_PARTNER_KEY',
                    key: 'YOUR_PARTNER_KEY',
                },
                '*'
            );
        }
    };

    window.addEventListener('message', handleMessage);
    return () => {
        window.removeEventListener('message', handleMessage);
    };
}, []);

return (
    <iframe
        ref={ref}
        src="https://pay.capybera.xyz/?..."
        width="100%"
        height="650"
        frameBorder="0"
    />
);

Event Reference

EventDirectionDescription
PAY_HOLDSTATION_STARTWidget → PartnerWidget is loaded and ready to receive config.
SET_PARTNER_KEYPartner → WidgetPartner sends their key to the widget.