31 lines
700 B
TypeScript
31 lines
700 B
TypeScript
import type { HTMLAttributes } from 'react';
|
|
import type { VariantProps } from 'tailwind-variants';
|
|
import { tv } from 'tailwind-variants';
|
|
import styles from './Spinner.module.css';
|
|
|
|
const spinnerVariants = tv({
|
|
base: styles.loader,
|
|
variants: {
|
|
size: {
|
|
extraSmall: 'w-6 h-6',
|
|
small: 'w-8 h-8',
|
|
medium: 'w-12 h-12',
|
|
large: 'w-16 h-16',
|
|
},
|
|
},
|
|
});
|
|
|
|
type SpinnerVariantsProps = VariantProps<typeof spinnerVariants>;
|
|
|
|
export interface SpinnerProps extends HTMLAttributes<HTMLDivElement> {
|
|
size?: SpinnerVariantsProps['size'];
|
|
};
|
|
|
|
export function Spinner({
|
|
size = 'medium',
|
|
className,
|
|
}: SpinnerProps) {
|
|
return (
|
|
<div className={spinnerVariants({ size, className })}></div>
|
|
);
|
|
}
|