TokenAmountInputWithSelectProps

type TokenAmountInputWithSelectProps = TokenAmountInputProps & object;

Beta

Props for the TokenAmountInputWithSelect component. These augment the props of the TokenAmountInputProps with props to track a related token selection.

Type Declaration

bottomEndSlot?

optional bottomEndSlot?: React.ReactNode;

Optional content rendered on the right side of the bottom row. It appears opposite the “Balance:” caption when the balance is shown and remains right-aligned when it is hidden. Useful for secondary metadata like a USD-value readout. Renders alongside the “Max” button when both are provided.

containerClassName?

optional containerClassName?: string;

Class name applied to the outer layout container.

onChangeToken?

optional onChangeToken?: (tokenAddress?) => void;

Custom event handler that is invoked when a selection is made via the token select.

Parameters

Parameter	Type	Description
tokenAddress?	Address	The newly selected tokens address.

Returns

void

selectedTokenAddress?

optional selectedTokenAddress?: Address;

The currently selected token. Use this to control the component.

showBalance?

optional showBalance?: boolean;

Show the selected token’s balance beneath the amount input, once a token is selected, and each token’s balance in the dropdown. Defaults to true. When the balance is also the most the input accepts (no lower maxAmount), clicking it enters the whole balance. Hidden, balances still cap the amount; only the figures go.

showUseMaxButton?

optional showUseMaxButton?: boolean;

Show a “Use max” button to set the input to the maximum amount.

tokens?

optional tokens?: TokenOption[];

The tokens as TokenOptions that will be used as the available tokens to select from.

tokenSelectProps?

optional tokenSelectProps?: Omit<TokenSelectProps, "tokens" | "onSelectToken" | "selectedTokenAddress">;

Additional props to pass to the TokenSelect component.