35 lines
1.1 KiB
TypeScript
35 lines
1.1 KiB
TypeScript
import styles from './loading.module.css'
|
|
import { VariantProps } from 'class-variance-authority'
|
|
|
|
import { variants } from './variants'
|
|
|
|
export interface LoadingProps extends VariantProps<typeof variants> {
|
|
size?: number
|
|
}
|
|
|
|
export function Loading({ type, size = 20 }: LoadingProps) {
|
|
const classNames = variants({
|
|
type,
|
|
})
|
|
|
|
return (
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
width={size}
|
|
height={size}
|
|
viewBox="0 0 20 21"
|
|
fill="none"
|
|
className={classNames}
|
|
>
|
|
<circle className={styles.dot} cx="10" cy="2.64147" r="1.73913" />
|
|
<circle className={styles.dot} cx="16.087" cy="5.25018" r="1.73913" />
|
|
<circle className={styles.dot} cx="18.2609" cy="10.9023" r="1.73913" />
|
|
<circle className={styles.dot} cx="16.087" cy="16.5545" r="1.73913" />
|
|
<circle className={styles.dot} cx="10" cy="19.1632" r="1.73913" />
|
|
<circle className={styles.dot} cx="3.91304" cy="16.5545" r="1.73913" />
|
|
<circle className={styles.dot} cx="1.73913" cy="10.9023" r="1.73913" />
|
|
<circle className={styles.dot} cx="3.91304" cy="5.25018" r="1.73913" />
|
|
</svg>
|
|
)
|
|
}
|