> ## Documentation Index
> Fetch the complete documentation index at: https://bkey.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Wallet card

> BMoniWalletCard and BMoniWalletCardBalance — the low-level wallet card primitives.

<Info>
  If you are using `bmoni_embedded_wallets_cards`, prefer `EmbeddedWalletCard` — it wraps these primitives and drives them directly from an `EmbeddedWallet` model. Use the raw primitives only when you need full control over the data binding.
</Info>

***

## BMoniWalletCard

A 250 px-tall card with:

* A configurable background (currency type or image)
* A top-left logo slot
* An optional bottom-right info button
* A centred balance slot
* A built-in scale-down press animation

```dart theme={null}
BMoniWalletCard(
  background: const BMoniWalletCardBackground.type(BMoniWalletType.usd),
  onInfoTap: () => showWalletDetails(),
  reserveBottomSpaceForPageIndicator: hasMultipleWallets,
  balanceChild: BMoniWalletCardBalance(
    wholePart: r'$1,234',
    decimalPart: '.56',
    isHidden: isBalanceHidden,
    onToggleHidden: () => setState(() => isBalanceHidden = !isBalanceHidden),
  ),
)
```

### Background variants

```dart theme={null}
// Built-in type (uses the bundled per-currency background art)
BMoniWalletCardBackground.type(BMoniWalletType.usd)
BMoniWalletCardBackground.type(BMoniWalletType.ngn)
BMoniWalletCardBackground.type(BMoniWalletType.eur)
BMoniWalletCardBackground.type(BMoniWalletType.gbp)
BMoniWalletCardBackground.type(BMoniWalletType.cad)
BMoniWalletCardBackground.type(BMoniWalletType.mxn)
BMoniWalletCardBackground.type(BMoniWalletType.consolidated)

// Custom image asset
BMoniWalletCardBackground.asset('assets/images/my_card_bg.png')

// Network image
BMoniWalletCardBackground.network('https://example.com/card.jpg')
```

You can also pick one of the 6 brand colour variants (`01`–`06`) per currency type — these are used automatically by `EmbeddedWalletCard` when you pass a `colorSuffix`.

### BMoniWalletCard props

| Prop                                 | Type                        | Default | Description                                                                     |
| ------------------------------------ | --------------------------- | ------- | ------------------------------------------------------------------------------- |
| `background`                         | `BMoniWalletCardBackground` | —       | Card background.                                                                |
| `balanceChild`                       | `Widget?`                   | `null`  | Widget rendered in the centre of the card (typically `BMoniWalletCardBalance`). |
| `onInfoTap`                          | `VoidCallback?`             | `null`  | Called when the info button is tapped.                                          |
| `onTap`                              | `VoidCallback?`             | `null`  | Called when the card itself is tapped.                                          |
| `reserveBottomSpaceForPageIndicator` | `bool`                      | `false` | Adds bottom padding to avoid overlap with a `PageIndicator`.                    |

***

## BMoniWalletCardBalance

The centred balance display widget for use inside `BMoniWalletCard`.

```dart theme={null}
BMoniWalletCardBalance(
  wholePart: r'$1,234',
  decimalPart: '.56',
  isHidden: false,
  onToggleHidden: () {},
)
```

| Prop             | Type           | Description                                                    |
| ---------------- | -------------- | -------------------------------------------------------------- |
| `wholePart`      | `String`       | The pre-formatted whole part of the amount (e.g. `r'$1,234'`). |
| `decimalPart`    | `String`       | The pre-formatted decimal part (e.g. `'.56'`).                 |
| `isHidden`       | `bool`         | When `true`, replaces the amount with bullet dots.             |
| `onToggleHidden` | `VoidCallback` | Called when the eye icon is tapped.                            |