Loader
A loader component that displays a loading animation.
The Loader component is a loader component that displays a loading animation. It is a great way to show users that content is loading and to keep them engaged while they wait.
Use the type prop to specify the type of loader to display. The spinner type displays a spinning circle loader, while the dots type displays a three-dot loader.
Usage
javascript
1import Loader from "@/components/atoms/Loader"; 2 3<Loader type="spinner" color="primary" />
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| type | "spinner" | "dots" | "spinner" | The type of loader to display. Possible values are spinner and dots. |
| color | string | "primary" | Tailwind color key used for the focus ring and border (focus-within:border-*). |
| className | string | "" | Additional Tailwind classes for the container. |
| ...props | object | - | Any other valid <div> attributes (e.g. role, aria-*, etc.). |