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

# Credits Widgets

> Wallet balance and transaction history components

**Credits Widgets** are two independent components for showing a customer's prepaid credit wallet: [Credit Balance](/docs/exportable-ui/credits-widgets/credit-balance) and [Credit History](/docs/exportable-ui/credits-widgets/credit-history). Use one on its own, or place both together on a billing or account page.

Each component is presentational and takes its own prop shape. There is no shared parent component.

## Components

<CardGroup cols={2}>
  <Card icon="wallet" href="/docs/exportable-ui/credits-widgets/credit-balance" title="Credit Balance">
    Wallet balance card showing current credits and monetary value.
  </Card>

  <Card icon="clock-rotate-left" href="/docs/exportable-ui/credits-widgets/credit-history" title="Credit History">
    Transaction history table with pagination and multi-wallet selection.
  </Card>
</CardGroup>

## Import

```tsx theme={null}
import '@flexprice/ui/style.css';
import { CreditBalance, CreditHistory } from '@flexprice/ui';
```

Each component page documents its own prop shape, an example, and the adapters for mapping Flexprice wallet API responses.

## See also

<CardGroup cols={2}>
  <Card icon="book-open" href="/docs/exportable-ui/overview" title="Overview">
    Install Flexprice UI, choose a data source, theme, and integrate components.
  </Card>

  <Card icon="chart-simple" href="/docs/exportable-ui/usage-widgets/usage-widgets" title="Usage Widgets">
    Metric cards, trend chart, breakdown table, and quota bars.
  </Card>
</CardGroup>
