Pro Components
Base Components
Charts Group 3
Full dashboard with preset date buttons, custom date range picker, stats row, and multiple chart cards that respond to date selection.
Example
Dashboard Overview
Track your business performance
Total Revenue
$219,451
+12.5%
Total Orders
1,914
+8.2%
Visitors
45,205
-2.4%
Conversion Rate
4.2%
+5.1%
Revenue Trend
Daily revenue for selected period
Sales by Category
Revenue breakdown
Electronics
Clothing
Home
Sports
Traffic Sources
Where your visitors come from
Quick Stats
Key metrics summary
Avg Order Value$115
Orders/Day62
Revenue/Day$7,079
Visitors/Day1458
Introduction
Charts Group 3 is a complete dashboard section:- Date controls: Preset buttons (7d, 30d, 90d) and custom date range picker.
- Stats row: Four metric cards (revenue, orders, conversion, avg. order).
- Bento grid: Area chart, donut chart, quick stats card, and horizontal bar chart.
- Responsive: Grid collapses on smaller screens; all sections can react to date range.
Usage
import { ChartGroup12 } from "@/components/ui/chart-group-12";
<ChartGroup12 />;