# Pipeline Leakage block

> Sales funnel Sankey chart with lead source ribbons, a draining entrance and leak drops

Deals by lead source as a centered funnel Sankey in a shadcn Card, under a stat strip of conversion, leads, won deals and the biggest leak. Ribbons drain in, drops leak by loss rate, ranges morph, hover reads each stage; CSV and copy export.

- Type: Pro block
- Category: [Sankey Chart](https://reui.io/blocks/chart/sankey-chart.md)
- Page: https://reui.io/blocks/chart/sankey-chart/chart-53
- MCP: `get_block("chart-53")`
- Built with: Badge, Button, Card, Chart, Dropdown Menu, Separator, Toggle Group
- Installs with a ReUI Pro or Ultimate license; setup: https://reui.io/docs/license-setup

## Best for

A 6 stage sales funnel stacked by 3 lead sources that marks the leakiest step in red and lets the legend focus one source

## Agent notes

- Replace `RANGES` with per source deal counts in `STAGES` order; each range's `prior` cohort drives the stat strip deltas
- Recolor through `SOURCE_FILL` and `SOURCE_DOT` together, since the dot classes are what make Tailwind emit the emerald variables
- Download CSV writes `toCsv` rows and both exports confirm through a sonner `toast`, which needs a Toaster mounted in your app

## When not to use

- A trial cohort that leaks into named drop-off nodes, with no source split after signup: use [Trial Journey](https://reui.io/blocks/chart/sankey-chart/chart-49.md) (`get_block("chart-49")`)
- Open deals worked card by card and dragged between pipeline stages: use [Sales Pipeline](https://reui.io/blocks/application/kanban-board/kanban-board-3.md) (`get_block("kanban-board-3")`)

## Third-party libraries

- Recharts v3: [API reference](https://recharts.github.io/en-US/api/), [docs](https://recharts.github.io/en-US/guide/getting-started/)
- Motion v12: [API reference](https://motion.dev/docs/react-motion-component), [docs](https://motion.dev/docs/react) (the docs follow the latest Motion, with no React API break since v12)
- Sonner v2: [API reference](https://sonner.emilkowal.ski/toast), [docs](https://sonner.emilkowal.ski/getting-started)

## Install

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

## About Sankey Chart blocks

### When to use

- Money traced from its sources through each split, such as revenue lines down to net income
- Trial and sales funnels where every stage sheds volume and the size of each loss matters

### When not to use

- A share of one total split once, with no stage after the split: use the [Pie Chart blocks](https://reui.io/blocks/chart/pie-chart.md)
- Deploy or job runs where each row steps through fixed stages over time: use the [Status Tracker blocks](https://reui.io/blocks/chart/status-tracker.md)
- Headline totals and their deltas read as numbers, with no flow between them: use the [Stats blocks](https://reui.io/blocks/application/stats.md)

### Agent notes

- Each block exports a `Chart` with no props that reads constants from its data file, so live figures mean swapping those constants or adding props
- Series tones are set twice in value-faces, a color map behind `CHART_CONFIG` and a dot class map for the legend, so a recolor edits both
- Hover readouts render through the `formatter` of `ChartTooltipContent`, so a new field goes in the readout markup and not in the chart config

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.