import { Meta, ArgTypes, Story } from "@storybook/addon-docs/blocks";
import { LoadingIndicator } from "./LoadingIndicator";
import * as LoadingIndicatorStories from "./LoadingIndicator.stories";

<Meta of={LoadingIndicatorStories} />

# LoadingIndicator

LoadingIndicator is a component for displaying loading state.

## Install

```bash
yarn add @simplybusiness/mobius
```

## Usage

```js
import { LoadingIndicator } from "@simplybusiness/mobius";
```

## Examples

### Default

<Story of={LoadingIndicatorStories.Default} />

### Large

<Story of={LoadingIndicatorStories.Large} />

### With Custom Colour

<Story of={LoadingIndicatorStories.WithCustomColour} />

### With Custom Icon

<Story of={LoadingIndicatorStories.WithCustomIcon} />

## Props

<ArgTypes of={LoadingIndicator} />

## Component HTML Structure and Class names

The following HTML is rendered for an Icon:

```html
<svg class="mobius-loading-indicator" focusable="false" role="img">
  <g ... />
</svg>
```
