import { StatCard } from './StatCard';

export default {
  title: 'DataDisplay/StatCard',
  component: StatCard,
  tags: ['autodocs'],
};

export const Default = {
  args: {
    title: 'Total de Ventas',
    value: '$45,231',
    change: '+12.5% desde el mes pasado',
    changeType: 'positive',
    icon: 'ChartBarIcon',
    iconColor: 'blue',
  },
};

export const Negative = {
  args: {
    title: 'Usuarios Activos',
    value: '1,234',
    change: '-5.2% desde la semana pasada',
    changeType: 'negative',
    icon: 'UserIcon',
    iconColor: 'red',
  },
};

export const WithoutIcon = {
  args: {
    title: 'Total de Pedidos',
    value: '567',
    change: '+8.1%',
    changeType: 'positive',
  },
};

export const WithoutChange = {
  args: {
    title: 'Total de Productos',
    value: '1,234',
    icon: 'DocumentIcon',
    iconColor: 'green',
  },
};

export const CustomColors = {
  args: {
    title: 'Ingresos',
    value: '$12,345',
    change: '+20%',
    changeType: 'positive',
    icon: 'ChartBarIcon',
    iconColor: 'purple',
  },
};

