Types
Glossary of Types in Transaction components & utilities.
Call
type Call = { to: Hex; data?: Hex; value?: bigint };
LifecycleStatus
type LifecycleStatus =
| {
statusName: 'init';
statusData: null;
}
| {
statusName: 'error';
statusData: TransactionError;
}
| {
statusName: 'transactionIdle'; // initial status prior to the mutation function executing
statusData: null;
}
| {
statusName: 'buildingTransaction'; // resolving calls or contracts promise
statusData: null;
}
| {
statusName: 'transactionPending'; // if the mutation is currently executing
statusData: null;
}
| {
statusName: 'transactionLegacyExecuted';
statusData: {
transactionHashList: Address[];
};
}
| {
statusName: 'success'; // if the last mutation attempt was successful
statusData: {
transactionReceipts: TransactionReceipt[];
};
};
TransactionButtonReact
type TransactionButtonReact = {
className?: string; // An optional CSS class name for styling the button component.
disabled?: boolean; // A optional prop to disable the submit button
text?: string; // An optional text to be displayed in the button component.
};
TransactionError
type TransactionError = {
code: string; // The error code representing the type of transaction error.
error: string; // The error message providing details about the transaction error.
message: string; // The error message providing details about the transaction error.
};
TransactionReact
type TransactionReact = {
calls?: Call[] | Promise<Call[]> | (() => Promise<Call[]>); // An array, Promise or callback that resolves to an array of calls to be made in the transaction. Mutually exclusive with the `contracts` prop.
capabilities?: WalletCapabilities; // Capabilities that a wallet supports (e.g. paymasters, session keys, etc).
chainId?: number; // The chainId for the transaction.
children: ReactNode; // The child components to be rendered within the transaction component.
className?: string; // An optional CSS class name for styling the component.
contracts?: ContractFunctionParameters[] | Promise<ContractFunctionParameters[]> | (() => Promise<ContractFunctionParameters[]>); // An array, Promise or callback that resolves to an array of contract function parameters for the transaction. Mutually exclusive with the `calls` prop.
onError?: (e: TransactionError) => void; // An optional callback function that handles transaction errors.
onStatus?: (lifecycleStatus: LifecycleStatus) => void; // An optional callback function that exposes the component lifecycle state
onSuccess?: (response: TransactionResponse) => void; // An optional callback function that exposes the transaction receipts
};
TransactionDefaultReact
export type TransactionDefaultReact = {
disabled?: boolean;
} & Omit<TransactionReact, 'children'>;
TransactionResponse
type TransactionResponse = {
transactionReceipts: TransactionReceipt[]; // An array containing the transaction receipts
};
TransactionSponsorReact
type TransactionSponsorReact = {
className?: string; // An optional CSS class name for styling the sponsor component.
};
TransactionStatusReact
type TransactionStatusReact = {
children: ReactNode; // The child components to be rendered within the status component.
className?: string; // An optional CSS class name for styling the status component.
};
TransactionStatusActionReact
type TransactionStatusActionReact = {
className?: string; // An optional CSS class name for styling.
};
TransactionStatusLabelReact
type TransactionStatusLabelReact = {
className?: string; // An optional CSS class name for styling.
};
TransactionToastReact
type TransactionToastReact = {
children: ReactNode; // The child components to be rendered within the toast component.
className?: string; // An optional CSS class name for styling the toast component.
durationMs?: number; // An optional value to customize time until toast disappears
position?: 'top-center' | 'top-right' | 'bottom-center' | 'bottom-right'; // An optional position property to specify the toast's position on the screen.
};
TransactionToastActionReact
type TransactionToastActionReact = {
className?: string; // An optional CSS class name for styling.
};
TransactionToastIconReact
type TransactionToastIconReact = {
className?: string; // An optional CSS class name for styling.
};
TransactionToastLabelReact
type TransactionToastLabelReact = {
className?: string; // An optional CSS class name for styling.
};
WalletCapabilities
type WalletCapabilities = {
paymasterService?: PaymasterService;
};