For AI Agents
Hand your agent this brief or the ReUI MCP, not a screenshot. Installs with a ReUI Pro or Ultimate license.
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
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 trial cohort that leaks into named drop-off nodes, with no source split after signup: use the Trial Journey block
- Open deals worked card by card and dragged between pipeline stages: use the Sales Pipeline block
- A share of one total split once, with no stage after the split: use the Pie Chart blocks
- Deploy or job runs where each row steps through fixed stages over time: use the Status Tracker blocks
- Headline totals and their deltas read as numbers, with no flow between them: use the Stats blocks
Agent notes
- Replace
RANGESwith per source deal counts inSTAGESorder; each range'spriorcohort drives the stat strip deltas - Recolor through
SOURCE_FILLandSOURCE_DOTtogether, since the dot classes are what make Tailwind emit the emerald variables - Download CSV writes
toCsvrows and both exports confirm through a sonnertoast, which needs a Toaster mounted in your app - Each block exports a
Chartwith 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_CONFIGand a dot class map for the legend, so a recolor edits both - Hover readouts render through the
formatterofChartTooltipContent, so a new field goes in the readout markup and not in the chart config
Third-party API docs
- Recharts v3: API reference, docs
- Motion v12: API reference, docs (the docs follow the latest Motion, with no React API break since v12)
- Sonner v2: API reference, docs
https://reui.io/blocks/chart/sankey-chart/chart-53.mdget_block("chart-53")npx shadcn@latest add @reui/chart-53Shadcn Components in the Pipeline Leakage Block
Dependencies
- cn
- motion
- recharts
- sonner
Shadcn Pipeline Leakage Block
Sales funnel Sankey chart with lead source ribbons, a draining entrance and leak drops. Part of the ReUI Shadcn Sankey Chart blocks collection.
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.
It is composed from Badge, Button, Card, Chart, Dropdown Menu, Separator, Toggle Group, so every part of it is a primitive you can restyle with your own design tokens.
What You Can Build With the Pipeline Leakage Block
- Install it with the ReUI registry command in the toolbar above, then swap the placeholder content, data wiring, and business logic for your own.
- Compare it across all eight ReUI styles and both the Base UI and Radix bases in the customizer before committing to one direction.
- Combine it with the other Shadcn Sankey Chart blocks to assemble a full screen instead of a single section.
All Shadcn Sankey Chart Blocks
The rest of this category, each on its own page with a live preview, the components it is built from, and the install command.
- Revenue Flow Income statement Sankey chart with revenue, cost and profit flows and a quarter picker
- Trial Journey Trial conversion Sankey chart with channel signups, a drop-off node per stage and volume pulses
Related Shadcn Charts Block Categories
- Area Chart (4) Area chart cards with gradient fills, comparisons to a prior period or baseline, hover readouts and CSV export for trends over time.
- Bar Chart (12) Bar and column charts, stacked hourly outcomes, 3D prisms, diverging lanes and lollipop stems for comparing values.
- Composed Chart (5) Composed charts that layer areas and lines on one axis, with reference lines, goals and release markers.
- Line Chart (6) Line chart cards with single and multi-series lines, dual axes, reference lines and metric switchers.
- Pie Chart (2) Pie and donut chart cards with center totals, per-segment legends and period tabs for share of a whole.
- Radial Chart (3) Radial gauges with semicircle and full arcs, segmented rings and status labels for progress toward a target.
All Shadcn Block Groups
Browse the full ReUI Shadcn blocks library by product surface. Each group bundles category-level blocks you can mix and match across your project.
- Shadcn Application Blocks (303) Browse 303 Shadcn Application blocks across 23 categories.
- Shadcn Data Grid Blocks (43) Browse 43 Shadcn Data Grid blocks across 9 categories.
- Shadcn Charts Blocks (51) Browse 51 Shadcn Charts blocks across 10 categories.
- Shadcn Solutions Blocks (76) Browse 76 Shadcn Solutions blocks across 11 categories.
- Shadcn AI & Agents Blocks (18) Browse 18 Shadcn AI & Agents blocks across 2 categories.
- Shadcn eCommerce Blocks (87) Browse 87 Shadcn eCommerce blocks across 13 categories.
- Shadcn Marketing Blocks (67) Browse 67 Shadcn Marketing blocks across 8 categories.
Frequently Asked Questions
When should I use the Pipeline Leakage block?
Use it 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.
The Sankey Chart category fits:
- 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
For a trial cohort that leaks into named drop-off nodes, with no source split after signup, use the Trial Journey block. For open deals worked card by card and dragged between pipeline stages, use the Sales Pipeline block. For a share of one total split once, with no stage after the split, use the Pie Chart blocks. For deploy or job runs where each row steps through fixed stages over time, use the Status Tracker blocks. For headline totals and their deltas read as numbers, with no flow between them, use the Stats blocks.
What is the Pipeline Leakage block built with?
Can I restyle the Pipeline Leakage block?
How should I use Shadcn sankey chart blocks in a real project?
Start building with ReUI Pro today.
Every Pro block, every style, and every future addition, with one license for unlimited projects.
From $249, once. Lifetime updates.