overleaf/services/web/frontend/js/features/ui/components/bootstrap-5/button.tsx
Tim Down 07e16838b8 Merge pull request #16971 from overleaf/td-bootstrap-5-base
Bootstrap 5 base

GitOrigin-RevId: 2ac614298d31a9cf65430a46d726648a742044f9
2024-02-15 09:04:05 +00:00

32 lines
736 B
TypeScript

import { Button as BootstrapButton } from 'react-bootstrap-5'
import type { ButtonProps } from '@/features/ui/components/types/button-props'
const sizeClasses = new Map<ButtonProps['size'], string>([
['small', 'btn-sm'],
['default', ''],
['large', 'btn-lg'],
])
// TODO: Display a spinner when `loading` is true
function Button({
variant = 'primary',
size = 'default',
disabled = false,
loading = false,
children,
}: ButtonProps) {
const sizeClass = sizeClasses.get(size)
return (
<BootstrapButton
variant={variant}
className={sizeClass}
disabled={disabled}
{...(loading ? { 'data-ol-loading': true } : null)}
>
{children}
</BootstrapButton>
)
}
export default Button