Component events

LoopCheckout provides a set of events and callback props to let your application respond to user actions, state changes, and errors.

React Event Props

Prop name	Fires when...	Payload type
`onLoopCryptoCheckoutReady`	Component is ready	`InitializedEvent`
`onLoopCryptoCheckoutReadyFailed`	Initialization failed	`InitFailedEvent`
`onLoopCryptoCheckoutStateChange`	State changes (see below)	`LoopCryptoCheckoutStateChangeEvent`
`onLoopCryptoCheckoutFailed`	Payment failed	`LoopCryptoCheckoutFailedEvent`
`onLoopCryptoCheckoutTokenChange`	Token selection changed	`LoopCryptoCheckoutTokenChangeEvent`
`onLoopCryptoCheckoutAuthorizationUpdated`	Authorization updated	`LoopCryptoCheckoutAuthorizationUpdatedEvent`
`onLoopCryptoCheckoutAuthorizationConfirmed`	Authorization confirmed	`LoopCryptoCheckoutAuthorizationConfirmedEvent`
`onLoopCryptoCheckoutCreated`	Payment created	`LoopCryptoCheckoutCreatedEvent`
`onLoopCryptoCheckoutConfirmed`	Payment confirmed on-chain	`LoopCryptoCheckoutConfirmedEvent`

Web Component Events

Event name	Fires when...	Payload type
`ready`	Component is ready	`InitializedEvent`
`readyfailed`	Initialization failed	`InitFailedEvent`
`statechange`	State changes (see below)	`LoopCryptoCheckoutStateChangeEvent`
`failure`	Payment failed	`LoopCryptoCheckoutFailedEvent`
`tokenchange`	Token selection changed	`LoopCryptoCheckoutTokenChangeEvent`
`authorizationupdated`	Authorization updated	`LoopCryptoCheckoutAuthorizationUpdatedEvent`
`authorizationconfirmed`	Authorization confirmed	`LoopCryptoCheckoutAuthorizationConfirmedEvent`
`created`	Payment created	`LoopCryptoCheckoutCreatedEvent`
`confirmed`	Payment confirmed on-chain	`LoopCryptoCheckoutConfirmedEvent`
`walletchange`	User changed wallet	`WalletChangeEvent`
`networkchange`	User changed network	`NetworkChangeEvent`

State Change Events

The onLoopCryptoCheckoutStateChange/statechange event provides detailed information about the current state of the payment process. The state property can be one of:

idle
confirmingBalance
confirmingAuthorization
updatingAuthorization
signingMessage
creatingPayment
confirmingPayment
complete

Each state includes a message and a data object with state-specific details. See the type definitions for full details.

Error Events

The onLoopCryptoCheckoutFailed/failure event provides a type, message, and data object describing the error.