Widgets - Crossmint Docs

The Flutter SDK provides optional UI widgets that can be imported from crossmint_flutter_ui.dart. These pull in Material Design dependencies — if you prefer a fully headless approach, use the controllers directly.

CrossmintWalletStatusBuilder

Reactive widget that rebuilds whenever the wallet status or instance changes.

Props

builder

CrossmintWalletStatusWidgetBuilder

required

Usage

import 'package:crossmint_flutter/crossmint_flutter_ui.dart';

CrossmintWalletStatusBuilder(
  builder: (context, data) {
    switch (data.state.walletStatus) {
      case CrossmintWalletStatus.inProgress:
        return const CircularProgressIndicator();
      case CrossmintWalletStatus.loaded:
        return Text('Address: ${data.state.currentWallet!.address}');
      default:
        return const Text('No wallet');
    }
  },
)

CrossmintWalletConsumer

Provides access to the wallet context data from the widget tree.

Usage

CrossmintWalletConsumer(
  builder: (context, data) {
    return ElevatedButton(
      onPressed: () async {
        final wallet = data.state.currentWallet;
        final balances = await wallet?.balances();
        print('Balances: $balances');
      },
      child: const Text('Check Balances'),
    );
  },
)

CrossmintOtpSignerListener

Automatically listens for OTP challenges and shows the appropriate dialog. This is a Flutter advantage over React Native — OTP prompts are handled declaratively.

Props

otpController

CrossmintWalletOtpController

required

child

Widget

required

enabled

bool

barrierDismissible

bool

Usage

CrossmintOtpSignerListener(
  otpController: walletController.otp,
  child: const WalletScreen(),
)

CrossmintExportPrivateKeyButton

Renders a button that allows the user to export their wallet’s private key. Only works with email and phone signers. Will not render for passkey or external wallet signers.

Props

wallet

CrossmintRuntimeWalletBase

required

Wallet whose private key will be exported. The button only renders when [CrossmintRuntimeWalletBase.canExportPrivateKey] is true (email/phone signer wallets).

Show properties

client

CrossmintClient

required

Top-level Crossmint client shared by all wallet operations.

Show properties

config

CrossmintClientConfig

required

auth

CrossmintAuthClient?

wallets

CrossmintWalletsClient?

credentials

CrossmintCredentialsClient?

orders

CrossmintOrdersClient?

tokens

CrossmintTokensClient?

users

CrossmintUsersClient?

transport

CrossmintTransport?

authLauncher

CrossmintAuthLauncher?

runtimeOverrides

CrossmintClientRuntimeOverrides?

wallet

CrossmintWallet

required

Server-issued wallet snapshot backing this runtime instance.

Show properties

String

required

chain

String?

address

String?

owner

String?

raw

CrossmintJsonMap

recoverySigner

CrossmintSignerConfig?

signer

CrossmintWalletApprovalSigner?

additionalSigners

List<CrossmintWalletApprovalSigner>

deviceSignerKeyStorage

DeviceSignerKeyStorage?

Storage backend for hardware-backed device signer keys.

onAuthRequired

CrossmintSignerAuthRequiredCallback?

Callback invoked when a signer operation requires user authentication.

onExported

VoidCallback?

Called after the export flow completes successfully.

onError

void Function(Object error)?

Called when the export flow throws. Receives the underlying exception so consumers can surface a localized error message.

childBuilder

CrossmintExportPrivateKeyButtonBuilder?

Optional builder for the button visual. When null, falls back to the React Native parity Material OutlinedButton with a themed CircularProgressIndicator while the export is in flight. When non-null, the builder is invoked whenever the wallet is eligible to export and receives the current isLoading flag plus an onExport callback that the consumer wires to their own tap target. The onExport callback is null while loading so consumers can disable their button directly without a separate mounted check.

Usage

import 'package:crossmint_flutter/crossmint_flutter_ui.dart';

CrossmintExportPrivateKeyButton(
  wallet: wallet,
  onExported: () => print('Key exported'),
)

CrossmintWalletUiState (`data.state`)

The state exposed on CrossmintWalletContextData (the second argument of every builder). Fields and convenience getters:

Field / getter	Type	Description
`isInitializing`	`bool`
`isLoadingWallet`	`bool`
`authState`	`CrossmintAuthState`
`walletStatus`	`CrossmintWalletStatus`
`currentWallet`	`CrossmintWallet?`
`pendingOtpChallenge`	`CrossmintOtpChallenge?`
`initializationError`	`Object?`
`walletError`	`Object?`
`isAuthenticated`	`bool`
`isLoggedOut`	`bool`
`user`	`CrossmintAuthenticatedUser?`
`authErrorMessage`	`String?`
`error`	`Object?`
`errorMessage`	`String?`
`hasWallet`	`bool`
`needsOtp`	`bool`

​CrossmintWalletStatusBuilder

​Props

​Usage

​CrossmintWalletConsumer

​Usage

​CrossmintOtpSignerListener

​Props

​Usage

​CrossmintExportPrivateKeyButton

​Props

​Usage

​CrossmintWalletUiState (data.state)

CrossmintWalletStatusBuilder

Props

Usage

CrossmintWalletConsumer

Usage

CrossmintOtpSignerListener

Props

Usage

CrossmintExportPrivateKeyButton

Props

Usage

CrossmintWalletUiState (`data.state`)