import { Meta, Story, ArgsTable, Canvas } from '@storybook/blocks';
import Image from '../Image';
import * as ImageStories from './Image.stories';

<Meta of={ImageStories} />

# Image

<br />

## `Images` are enhanced wrappers around the img tag.

<br />

### Only image

<Canvas>
  <Story of={ImageStories.OnlyImage} />
</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} />
