import { Timeline } from './Timeline';

const timelineItems = [
  {
    date: '15 de Enero 2024',
    title: 'Pedido creado',
    description: 'El pedido #12345 ha sido creado exitosamente.',
    icon: 'CheckCircleIcon',
  },
  {
    date: '16 de Enero 2024',
    title: 'Pedido confirmado',
    description: 'El pedido ha sido confirmado y está en proceso.',
    icon: 'CheckCircleIcon',
  },
  {
    date: '17 de Enero 2024',
    title: 'En tránsito',
    description: 'El pedido ha sido enviado y está en camino.',
    icon: 'CheckCircleIcon',
  },
  {
    date: '18 de Enero 2024',
    title: 'Entregado',
    description: 'El pedido ha sido entregado exitosamente.',
    icon: 'CheckCircleIcon',
  },
];

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

export const Default = {
  args: {
    items: timelineItems,
  },
};

export const Simple = {
  args: {
    items: [
      {
        date: 'Hoy',
        title: 'Evento 1',
        description: 'Descripción del primer evento',
      },
      {
        date: 'Ayer',
        title: 'Evento 2',
        description: 'Descripción del segundo evento',
      },
    ],
  },
};

export const WithoutIcons = {
  args: {
    items: timelineItems.map(({ icon, ...item }) => item),
  },
};

