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

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

# Bullet
<br />

## `Bullets` are components comprised of an icon and text that can be used to create customized lists.
<br />

### Default
<Canvas>
    <Story name="Default">
        <Bullet content="Lorem ipsum dolor sit amet, consectetur adipiscing elit." />
    </Story>
</Canvas>

### With icon
<Canvas>
    <Story name="With icon">
        <Bullet
            content="Lorem ipsum dolor sit amet, consectetur adipiscing elit."
            iconType="check"
        />
    </Story>
</Canvas>

### With tooltip
<Canvas>
    <Story name="With tooltip">
        <Bullet
            content="Lorem ipsum dolor sit amet, consectetur adipiscing elit."
            iconType="plus"
            tooltip="Aenean vel arcu ac purus mollis sollicitudin. Donec felis tortor, pretiu"
        />
    </Story>
</Canvas>

## Usage Example
```jsx
import Bullet from '@appdirect/sfb-theme-components/src/atoms/bullet/Bullet'

<Bullet
    content="Lorem ipsum dolor sit amet, consectetur adipiscing elit."
    iconType="plus"
    tooltip="Aenean vel arcu ac purus mollis sollicitudin. Donec felis tortor, pretiu"
/>
```

## Props
<ArgsTable of={Bullet} />
