Filter Funnel Panel
A filter funnel showing active filters as ordered steps, each with a proportional bar and the results remaining, above a clear all footer.
A filter funnel showing active filters as ordered steps, each with a proportional bar and the results remaining, above a clear all footer.
Search blocks by description or jump to a page.
The source for every Application block is included with Basic and Pro. Pick a plan to copy the code.
Already purchased? Log in
Filter Funnel Panel shows how each active filter narrows a result set, in the order applied. A baseline row states the starting set (All issues, 1,248 in workspace) with a full width bar, then one row per filter (status:open, team:frontend, priority:high, updated:this-sprint) renders the token, a remove control, the count that remains after it applies, and a proportional bar with how many that step filters out. A footer states the final match, 21 of 1,248 issues, beside a Clear all button.
Steps are one array carrying the remaining count, the removed count, and a percentage width, so the bars read as a shrinking funnel without any layout math. The status filter removing the most results is visible from the bar lengths alone, which is the whole point of the view.
Reach for this block when a filtered list feels smaller than expected and users need to see which filter did the cutting, wired to your query engine so each step reflects a real count. Removing a row above widens the funnel from that point down.
A natural flow around it on an Application Pro page:
Before
After
One strong use is the issue filter funnel. Other stepped narrowing views:
Tip: label each bar with what it filters out, not just what remains; the removed count is what tells users which filter to loosen first.