import React from 'react';

import { Avatar } from '../components/Avatar';

import gradient from './assets/Amin.jpg'

export default {
    title: 'Design System/Avatar',
    component: Avatar
};

const Template = (args) => <Avatar {...args} />;

export const Image = Template.bind({});
Image.args = {
    size: 40,
    source: gradient,
    name: 'Yannick van Diermen'
};

export const Name = Template.bind({});
Name.args = {
    size: 40,
    name: 'Yannick van Diermen'
};

export const Name2 = Template.bind({});
Name2.args = {
    size: 40,
    name: 'John Doe',
};

export const Anonymous = Template.bind({});
Anonymous.args = {
    size: 40,
    hash: '3'
};
