import {Meta, Story, Canvas} from '@storybook/addon-docs/blocks'
import Spinner from './index'

<Meta title="Components/Spinner" />

# `Spinner` component

## allowed props:

**size:** (type: **number**) - value corresponds to tailwind's `w-` postfix

**color:** (type: **string**) - value corresponds to tailwind's `text-` postfix

**className:** (type: **string**) - any other classes

```
<Spinner size={5} color="red-500" />
```

<Spinner size={5} color="red-500" />

<Canvas>
  <Story name="Default">
    <div className="flex flex-col w-full bg-black p-5 space-y-6">
      <Spinner />
    </div>
  </Story>
  <Story name="Size">
    <div className="flex flex-col w-full bg-black p-5 space-y-6">
      <Spinner size={10} />
    </div>
  </Story>
  <Story name="Color">
    <div className="flex flex-col w-full bg-black p-5 space-y-6">
      <Spinner size={5} color="red-500" />
    </div>
  </Story>
</Canvas>
