import { Story, Canvas, ArgsTable } from '@storybook/addon-docs';

import IconWithFallback from '.';

# IconWithFallback

Icon component that takes an image src and uses `onError` to fallback to the first letter of the icon `name`

<Canvas>
  <Story id="components-ui-iconwithfallback--default-story" />
</Canvas>

## Props

<ArgsTable of={IconWithFallback} />

## Usage

The following describes the props and example usage for this component.

### Fallback

If the image src errors `onError` the image tag will be replace with a span and the first letter of the `name` prop

<Canvas>
  <Story id="components-ui-iconwithfallback--default-story" />
</Canvas>
