import React from 'react'
import { Story, Meta } from '@storybook/react'
import { Avatar, AvatarProps } from './Avatar'

export default {
  title: 'Image and icons/Avatar',
  component: Avatar,
  argTypes: {
    size: {
      name: 'size',
      description: 'Controls the avatar size',
      alt: { name: 'string', required: false },
      control: {
        type: 'select',
        options: ['xxs', 'xs', 'sm', 'md', 'lg', 'xl']
      }
    }
  }
} as Meta

const Template: Story<AvatarProps> = (args: any) => <Avatar {...args}></Avatar>

export const Default = Template.bind({})
Default.args = {
  source: 'https://via.placeholder.com/300.png/2772F0/2772F0',
  size: 'sm',
  alt: 'Avatar image'
}
