KPI Spark Cards
Cards de métricas com mini spark line SVG para dashboards — receita, ocupação, contratos e indicadores de tendência.
Default
4 KPIs com spark line
Receita Total
+8,3%R$ 1,24M
Taxa de Ocupação
+2,1%94,2%
Novos Contratos
+14,3%38
Inadimplência
+0,4%3,2%
import { KpiSparkCards } from "@/components/blocks/kpi-spark-cards";
// Default (dados PropTech)
<KpiSparkCards />
// Customizado:
<KpiSparkCards
stats={[
{
label: "Receita Total",
value: "R$ 1,24M",
change: "+8,3%",
trend: "up",
sparkData: [820, 932, 901, 934, 1290, 1330, 1240],
},
{
label: "Inadimplência",
value: "3,2%",
change: "+0,4%",
trend: "down",
sparkData: [2.5, 2.8, 2.6, 3.0, 3.1, 3.2, 3.2],
},
]}
/>2 colunas
Grid 2 cols
Receita Total
+8,3%R$ 1,24M
Taxa de Ocupação
+2,1%94,2%
Novos Contratos
+14,3%38
Inadimplência
+0,4%3,2%
<KpiSparkCards className="sm:grid-cols-2 lg:grid-cols-2" />