Swap Ticket

A token swap widget for DEX and crypto wallet apps, with an editable amount, a flip button, a token picker and slippage settings.

Swap Ticket

A token swap widget for DEX and crypto wallet apps, with an editable amount, a flip button, a token picker and slippage settings.

When to use it

Composed transaction forms where validation, amount entry and confirmation belong in one surface. Folding the validation message into the CTA label removes the error row that normally shifts the layout as the user types.

Props · SwapTicket

Prop	Type	Default
title?	stringHeading above the pair.	"Trade"
tokens?	SwapToken[]The book the ticket can trade from — the first two are the opening pair.	TOKENS
paySymbol?	stringOpening pay / receive symbols (must exist in `tokens`).	·
receiveSymbol?	string	·
defaultAmount?	string	"1.2"
slippage?	stringRight-hand footer chip — the slippage policy in force.	"Auto · 0.5%"
onSubmit?	(ticket: { side: "buy" \| "sell"; pay: SwapToken; receive: SwapToken; amount: number }) =>	·

Generated from the component source. Run npm run props:extract after changing a signature.