import { Spinner } from './Spinner';

export default {
  title: 'Atoms/Spinner',
  component: Spinner,
  tags: ['autodocs'],
  argTypes: {
    size: {
      control: 'select',
      options: ['small', 'medium', 'large'],
    },
    variant: {
      control: 'select',
      options: ['primary', 'secondary', 'white'],
    },
  },
};

export const Default = {
  args: {
    size: 'medium',
    variant: 'primary',
  },
};

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

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

export const Secondary = {
  args: {
    variant: 'secondary',
  },
};

export const White = {
  args: {
    variant: 'white',
  },
  decorators: [
    (Story) => (
      <div className="bg-gray-800 p-4">
        <Story />
      </div>
    ),
  ],
};

