Pro Components
Base Components
Charts Group 7
Three-panel revenue analytics group — area chart with period switcher, segmented claim-status bar, and a department revenue donut.
Example
$276,000.00
Total Revenue (Last 6 Months)
This Year
Prev Year
Claim Status
1,247 Claims This Month
12.5%33.9%53.6%
Revenue by Department
+8.4%vs last month
$250KTotal
Cardiology
$145K58%
Orthopedics
$62K25%
Oncology
$33K13%
General
$10K4%
Introduction
Charts Group 7 includes:- Revenue flow: Stacked area chart comparing this year vs previous year with a
Last 6 Months/Last Yearperiod switcher driven by a dropdown menu (state synced to the URL via?period=). - Claim status bar: Segmented horizontal stat bar split across Pending, Submitted, and Approved with hover-synced opacity, a percentage strip, and a tooltip-driven legend.
- Revenue by department: Donut chart with active-sector highlight, total in the donut center, and a side list whose rows highlight in sync with the slice on hover.
- Custom tooltip: Area chart's tooltip computes the year-over-year delta (
+%vs last year) inline. - Responsive layout: Single column on smaller screens; from
xlupward the area chart expands and the two right-side panels stack in a fixed-width column.
Usage
import { ChartGroup7 } from "@/components/ui/chart-group-7";
<ChartGroup7 />;fullYearData to drive the area chart, claimStatusData for the segmented bar, and departmentRevenueData for the donut. The period switcher reads from and writes to the period URL search param so the selected range survives a refresh.