# Revenue Trend block

> Revenue performance card with line chart and period tabs (5D / 2W / 1M)

Compact revenue KPI card with a single-series recharts line chart, a total computed from the active period, and 5D / 2W / 1M tab switching. Uses ReUI Card, Tabs, Button, Item, ChartContainer. For analytics, finance, and sales reporting widgets.

- Type: Pro block
- Category: [Line Chart](https://reui.io/blocks/chart/line-chart.md)
- Page: https://reui.io/blocks/chart/line-chart/chart-22
- MCP: `get_block("chart-22")`
- Built with: Button, Card, Item, Tabs
- Installs with a ReUI Pro or Ultimate license; setup: https://reui.io/docs/license-setup

## Best for

A rounded revenue card with an Export button, full width 5D, 2W and 1M tabs above a line on vertical grid lines, and a footnote

## Agent notes

- `revenueData` holds 7 days under 5D, 8 weeks under 2W and 6 under 1M; rebuild each series to match `PERIODS`
- The Export `Button` has no onClick handler; wire it to your own export
- `totalRevenue` and `CustomTooltip` treat each `revenue` value as thousands, adding k or switching to M

## When not to use

- A row of KPI toggles that redraw one line for whichever metric is picked: use [Metric Switcher](https://reui.io/blocks/chart/line-chart/chart-6.md) (`get_block("chart-6")`)
- Several platforms compared as separate lines on one shared axis: use [Social Engagement](https://reui.io/blocks/chart/line-chart/chart-23.md) (`get_block("chart-23")`)

## Install

```bash
npx shadcn@latest add @reui/chart-22
```

## About Line Chart blocks

### When to use

- A balance, price or revenue trend as a single stroke with period tabs and a peak marker
- Several platforms or channels compared as separate strokes on one time axis
- Two measures on different scales plotted against left and right axes

### When not to use

- A trend that needs its volume emphasized with a filled region below it: use the [Area Chart blocks](https://reui.io/blocks/chart/area-chart.md)
- Compact tiles where each figure carries a small trend of its own: use the [Sparkline blocks](https://reui.io/blocks/chart/sparkline.md)

### Agent notes

- Each stroke takes its label and color from a `chartConfig` key passed to `ChartContainer`, so add a key for every new series

Every ReUI item has a twin like this one; the index is https://reui.io/llms.txt. Agents with the ReUI MCP (https://reui.io/docs/mcp) get the same guidance from the getters named above.