What it does
Draws ordered funnel segments with optional labels, tooltip, and legend.
The surrounding ChartFrame variants match the rest of the chart family.
Data shape
Each row should include a step label and numeric value. Pass the keys with `nameKey` and `dataKey`.
Common use cases
- Signup funnel from visitor to paid user.
- Sales pipeline volume by stage.
- Onboarding completion across required milestones.
Accessibility
Keep step names readable and pair the chart with exact conversion numbers where decisions depend on small changes.
Do not rely only on area differences for critical comparisons.
Next.js integration notes
Import from `@zentauri-ui/zentauri-components/charts/funnel` inside client components when interaction is required.
FAQ
How do I color each funnel step?
Add a color field to each datum or pass `colorKey` if your color field uses a different name.
Can labels be hidden?
Yes. Set `label={false}` and rely on tooltip or surrounding copy when the chart is compact.