Example App
RozoPayButton Examples
Developer-facing examples for testing payment flows and config behavior.
@rozoai/intent-pay v0.1.18-beta.1
RozoPayButton Reference
Available Props
Inline-params reference page for RozoPayButton and RozoPayButton.Custom.
Required Props
| Prop | Type | Required | Description |
|---|---|---|---|
| appId | string | Yes | Public app ID from Rozo. |
| toChain | number | Yes | Destination chain ID. |
| toAddress | string | Yes | Recipient address (EVM/Solana/Stellar format). |
| toToken | string | Yes | Destination token identifier for target chain. |
| children | ({ show, hide }) => ReactElement | Custom only | Required for RozoPayButton.Custom trigger rendering. |
Payment Props
| Prop | Type | Required | Description |
|---|---|---|---|
| toUnits | string | No | Exact destination amount (USD/EUR style amount), e.g. "10" or "10.50". |
| intent | string | No | Intent verb label such as "Pay", "Deposit", or "Purchase". |
| feeType | FeeType | No | Fee mode: exactIn (default) or exactOut. |
| paymentOptions | ExternalPaymentOptionsString[] | No | Limit/enable external payment methods. |
| preferredChains | number[] | No | Prioritize source assets from these chains. |
| preferredTokens | Token[] | No | Prioritize specific source tokens. |
| preferredSymbol | TokenSymbol[] | No | Prioritize token symbols (USDC, USDT, EURC). |
| metadata | Record<string, any> | No | Arbitrary metadata for tracking/correlation. |
Event + Behavior Props
| Prop | Type | Required | Description |
|---|---|---|---|
| onPaymentStarted | (event) => void | No | Called when payment tx is seen on chain. |
| onPaymentCompleted | (event) => void | No | Called when destination transfer/call succeeds. |
| onPaymentBounced | (event) => void | No | Called when destination call reverts and refunds. |
| onPayoutCompleted | (event) => void | No | Called when payout completes. |
| onOpen | () => void | No | Called when modal opens. |
| onClose | () => void | No | Called when modal closes. |
| defaultOpen | boolean | No | Open modal by default. |
| closeOnSuccess | boolean | No | Automatically close modal after success. |
| resetOnSuccess | boolean | No | Reset payment state after success. |
| connectedWalletOnly | boolean | No | Restrict flow to already-connected wallets only. |
| confirmationMessage | string | No | Custom message on confirmation page. |
| showProcessingPayout | boolean | No | Show payout-processing state after payment completion. |
Visual Props
| Prop | Type | Required | Description |
|---|---|---|---|
| mode | "light" | "dark" | "auto" | No | Visual mode. |
| theme | Theme | No | Built-in named theme. |
| customTheme | CustomTheme | No | Custom theme object. |
| disabled | boolean | No | Disable interaction. |