40 lines
912 B
TypeScript
40 lines
912 B
TypeScript
import { Spinner } from './Spinner';
|
|
|
|
interface ButtonProps {
|
|
onClick: () => void;
|
|
loading?: boolean;
|
|
disabled?: boolean;
|
|
labelLoading?: string;
|
|
labelReady: string;
|
|
className?: string;
|
|
}
|
|
|
|
export const Button = ({
|
|
onClick,
|
|
loading = false,
|
|
disabled = false,
|
|
labelLoading = '',
|
|
labelReady,
|
|
className
|
|
}: ButtonProps) => {
|
|
return (
|
|
<button
|
|
onClick={onClick}
|
|
disabled={disabled}
|
|
className={
|
|
className ??
|
|
'w-full h-10 px-4 flex items-center justify-center gap-2 bg-blue-600 text-white rounded-lg font-medium shadow-sm hover:bg-blue-500 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 disabled:bg-blue-400 disabled:cursor-not-allowed transition-colors'
|
|
}
|
|
>
|
|
{loading ? (
|
|
<>
|
|
<Spinner />
|
|
<span>{labelLoading}</span>
|
|
</>
|
|
) : (
|
|
labelReady
|
|
)}
|
|
</button>
|
|
);
|
|
};
|