shadcn.io is not affiliated with official shadcn/ui
Lead Sources Dashboard Block for React
Eight lead sources ranked with leads, conversion and cost per lead, a checkbox to include each in the blended figures and a slider that moves budget from the costliest source to the cheapest.
Installation
Overview
Weigh the channel mix before you move budget, with this lead sources panel for React with Base UI. A hairline frame with a plus mark on each corner lists eight sources (Organic search, Referrals, Events, Paid search, Paid social, Outbound, Partners and Direct), each with a bar for its leads, its conversion to opportunity and its cost per lead. A Checkbox on every row includes or leaves out that source, and the band below blends the ones left in: total leads, weighted conversion and blended cost per lead. A Slider in the header, "Shift budget", moves a share of the costliest included source's spend to the cheapest, and a polite line says what that adds: "+428 leads (+8.4%) if cost per lead holds". It's built from Checkbox, Slider and Guides. For marketing and revenue operations reviews.
FAQ
How do I fill it with my sources?
Edit SOURCES. Each has its leads for the period, the share of those leads that became opportunities and the dollars it costs per lead. Spend is leads times cost per lead, and every blended figure, the bars and the sentence are worked out from those three numbers.
What does Shift budget do?
It takes the chosen percentage of the costliest included source's spend and spends it on the cheapest included one, at each source's current cost per lead. The costliest loses the leads that spend bought, the cheapest gains the leads it buys, and total spend stays the same, so the blended cost per lead moves with the leads. Leaving a source out changes which two are costliest and cheapest.
Is the gain a forecast?
No. It holds each cost per lead flat, which rarely survives a bigger budget, and the note under the figures says to read it as an upper bound. Use it to see which sources are worth testing with more money, not to promise a number.
What stays local, and how do I wire it for real?
Everything: the figures are typed for a fixed 28 days, nothing is measured and no budget moves. To make it real, load leads, opportunities and spend per source from your CRM and ad accounts, and add a saturation curve per channel in place of the flat cost per lead.