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

<Meta title="Atoms/Image" component={Image} />

# Image
<br />

## `Images` are enhanced wrappers around the img tag.
<br />

### Only image
<Canvas>
    <Story name="Only image">
        <Image
            className="featuredCustomerImg"
            name="Satisfaction"
            src="https://d3bql97l1ytoxn.cloudfront.net/common_resources/customer/30/getsatisfaction.png"
        />
    </Story>
</Canvas>


## Usage Example

```jsx
import Image from '@appdirect/sfb-theme-components/src/atoms/image/Image';

<Image
    className="featuredCustomerImg"
    name="Satisfaction"
    src="https://d3bql97l1ytoxn.cloudfront.net/common_resources/customer/30/getsatisfaction.png"
/>
```
## Props

<ArgsTable of={Image} />
