import { Progress } from './Progress';

export default {
  title: 'Atoms/Progress',
  component: Progress,
  tags: ['autodocs'],
  argTypes: {
    size: {
      control: 'select',
      options: ['small', 'medium', 'large'],
    },
    variant: {
      control: 'select',
      options: ['primary', 'success', 'warning', 'danger'],
    },
  },
};

export const Default = {
  args: {
    value: 50,
    max: 100,
  },
};

export const WithLabel = {
  args: {
    value: 75,
    max: 100,
    showLabel: true,
  },
};

export const CustomLabel = {
  args: {
    value: 60,
    max: 100,
    showLabel: true,
    label: 'Progreso',
  },
};

export const Small = {
  args: {
    value: 40,
    size: 'small',
  },
};

export const Large = {
  args: {
    value: 80,
    size: 'large',
  },
};

export const Success = {
  args: {
    value: 90,
    variant: 'success',
    showLabel: true,
  },
};

export const Warning = {
  args: {
    value: 50,
    variant: 'warning',
    showLabel: true,
  },
};

export const Danger = {
  args: {
    value: 25,
    variant: 'danger',
    showLabel: true,
  },
};

export const Complete = {
  args: {
    value: 100,
    variant: 'success',
    showLabel: true,
  },
};

