Spinner
This component renders a spinning loading spinner.
Import
import {Spinner} from "cui-react";
Example
Render a basic spinner:
Visual:
Code:
<div className=" flex space-x-4 p-10">
<Spinner size="large" /> <Spinner color="green" size="medium" /> <Spinner color="red" size="small" />
</div>
Customizing
You can customize the Spinner
component using the following props:
size
(optional): Size of the spinner (small
,medium
,large
). Defaults tomedium
.color
(optional): Color variant of the spinner (blue
,red
,green
,yellow
,black
,white
). Defaults toblue
.
Example: Custom Size and Color
Visual:
Code:
<Spinner size="large" color="green" />
This example renders a large spinner with a green color.
Props
-
size
- Type:
"small" | "medium" | "large"
- Description: Size of the spinner. Defaults to
medium
.
- Type:
-
color
- Type:
"blue" | "red" | "green" | "yellow" | "black" | "white"
- Description: Color variant of the spinner. Defaults to
blue
.
- Type: