@navinc/base-react-components/src/avatar.story.js

Nav's Pattern Library

import React from 'react'
import Avatar from './avatar.js'
import readme from './avatar.readme.md'
import { iconsMap } from './icons/index.js'

export default {
  title: 'General/Avatar',
  component: Avatar,
  parameters: {
    readme: { content: readme },
  },
}

export const Basic = (args) => {
  return <Avatar {...args} />
}

Basic.argTypes = {
  size: {
    control: { type: 'radio' },
    options: ['medium', 'large'],
  },
  defaultIcon: {
    control: { type: 'select' },
    options: Object.keys(iconsMap),
  },
}

Basic.args = {
  src: 'https://dxkdvuv3hanyu.cloudfront.net/design-assets/logos/experian.svg',
  label: 'I am Optional',
  alt: '',
  size: '',
  defaultIcon: 'people/profile',
}