website refactor

apps/website/components/admin/AdminStatsPanel.tsx

@@ -0,0 +1,45 @@
+'use client';
+
+import React from 'react';
+import { Grid } from '@/ui/Grid';
+import { StatCard } from '@/ui/StatCard';
+import { LucideIcon } from 'lucide-react';
+
+interface AdminStat {
+  label: string;
+  value: string | number;
+  icon: LucideIcon;
+  variant?: 'blue' | 'purple' | 'green' | 'orange';
+  trend?: {
+    value: number;
+    isPositive: boolean;
+  };
+}
+
+interface AdminStatsPanelProps {
+  stats: AdminStat[];
+}
+
+/**
+ * AdminStatsPanel
+ * 
+ * Semantic container for admin statistics.
+ * Renders a grid of StatCards.
+ */
+export function AdminStatsPanel({ stats }: AdminStatsPanelProps) {
+  return (
+    <Grid cols={1} mdCols={2} lgCols={4} gap={4}>
+      {stats.map((stat, index) => (
+        <StatCard
+          key={stat.label}
+          label={stat.label}
+          value={stat.value}
+          icon={stat.icon}
+          variant={stat.variant}
+          trend={stat.trend}
+          delay={index * 0.05}
+        />
+      ))}
+    </Grid>
+  );
+}