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

# Summary Cards

> Summarized Profit & Loss or cash flow metrics.

![](https://github.com/Layer-Fi/layer-react/assets/1592431/06459f20-519e-4413-80ba-fb9965c32f9f)

```tsx theme={null}
import { ProfitAndLoss } from "@layerfi/components";
…
<ProfitAndLoss>
  <ProfitAndLoss.Summaries />
</ProfitAndLoss>
```

### Properties

<ParamField body="onTransactionsToReviewClick" type="() => void">
  Callback triggered when the user clicks the transactions-to-review CTA on the summary cards. Use this to navigate to the page in your app where users categorize their bank transactions.
</ParamField>

<ParamField body="reportingVariant" type="ProfitAndLossSummariesReportingVariant">
  Controls which reporting mode the summary cards display. Defaults to profit and loss.

  <Expandable title="ProfitAndLossSummariesReportingVariant properties">
    <ParamField body="type" type="'profitAndLoss' | 'cashflow'" default="profitAndLoss">
      With `'profitAndLoss'` (the default), the cards show revenue, expenses, and net profit.
      With `'cashflow'`, the cards show money in, money out, and net cash flow.
    </ParamField>

    <ParamField body="showProfitAndLossBreakdown" type="boolean" default="true">
      Only applies when `type` is `'cashflow'`. Controls whether the money in and money out cards
      include a categorized vs. uncategorized breakdown footer.
    </ParamField>
  </Expandable>
</ParamField>

<ParamField body="stringOverrides" type="ProfitAndLossSummariesStringOverrides">
  Overrides for default strings in the component.

  <Expandable title="ProfitAndLossSummariesStringOverrides properties">
    <ParamField body="revenueLabel" type="string">
      Changes the label for revenue in the cards. Can pass in values such as "income" or another term. Defaults to "Revenue".
    </ParamField>

    <ParamField body="expensesLabel" type="string">
      Changes the label for expenses in the cards. Can pass in values such as "costs" or another term. Defaults to "Expenses".
    </ParamField>

    <ParamField body="netProfitLabel" type="string">
      Changes the label for net profit in the cards. Can pass in values such as "net income" or another term. Defaults to "Net Profit".
    </ParamField>

    <ParamField body="moneyInLabel" type="string">
      Changes the label for money in when using the cashflow reporting variant. Defaults to "Money in".
    </ParamField>

    <ParamField body="moneyOutLabel" type="string">
      Changes the label for money out when using the cashflow reporting variant. Defaults to "Money out".
    </ParamField>

    <ParamField body="netCashFlowLabel" type="string">
      Changes the label for net cash flow when using the cashflow reporting variant. Defaults to "Net cash flow".
    </ParamField>
  </Expandable>
</ParamField>