import { CodeBlock, ConfigBlock } from "@src/helpers/DocBlocks";
import Loader from "./Loader";

# Loader

> A clickable UI element with active and hover states. Indicates to the user that it's clickable.

<CodeBlock>
  <Loader />
</CodeBlock>

## Configuration

<ConfigBlock of={Loader} />

## Examples

<CodeBlock title="Type: Primary">
  <Loader />
</CodeBlock>

<CodeBlock title="Type: With custom class">
  <Loader className={"custom"} />
</CodeBlock>

<CodeBlock title="Type: With custom prefix class and custom class">
  <Loader prefixClassName={"prefix"} className={"custom"} />
</CodeBlock>

<CodeBlock title="Size: Custom size">
  <Loader size={50} />
</CodeBlock>

<CodeBlock title="Themed">
  <Loader themed />
</CodeBlock>

<CodeBlock title="Themed: Custom color">
  <Loader themed color={"green"} />
</CodeBlock>

<CodeBlock title="Themed: Custom size">
  <Loader themed size={50} />
</CodeBlock>
