Stat

import { Stat, Sparkline } from '@six-vallees/ui-react';

export default function StatDemo() {
  return (
    <div className="grid w-full grid-cols-2 gap-4 text-on-surface max-md:grid-cols-1">
      <Stat label="Current Tickets" value="3,484" delta={{ value: '+7% vs last week', tone: 'success' }}>
        <Sparkline data={[4, 6, 5, 8, 7, 10, 9, 12]} type="area" className="text-chart-ink" />
      </Stat>
      <Stat label="SLA Compliance" value="92%" delta={{ value: '-1.3% vs last week', tone: 'error' }}>
        <Sparkline data={[12, 10, 11, 8, 9, 7, 6, 5]} className="text-chart-ink" />
      </Stat>
    </div>
  );
}