overleaf/services/web/frontend/js/shared/components/close.tsx
ilkin-overleaf 6437059783 Merge pull request #20063 from overleaf/ii-bs5-system-notifications
[web] BS5 system notifications

GitOrigin-RevId: a5a17a418193e325c0f561708c99240191cff8e7
2024-08-28 11:35:13 +00:00

34 lines
901 B
TypeScript

import { useTranslation } from 'react-i18next'
import MaterialIcon from '@/shared/components/material-icon'
import BootstrapVersionSwitcher from '@/features/ui/components/bootstrap-5/bootstrap-version-switcher'
type CloseProps = {
onDismiss: React.MouseEventHandler<HTMLButtonElement>
variant?: 'light' | 'dark'
}
function Close({ onDismiss, variant = 'light' }: CloseProps) {
const { t } = useTranslation()
return (
<button
type="button"
className={`close pull-right ${variant}`}
onClick={onDismiss}
>
<BootstrapVersionSwitcher
bs3={<span aria-hidden="true">&times;</span>}
bs5={
<MaterialIcon
type="close"
className="align-text-bottom"
accessibilityLabel={t('close')}
/>
}
/>
<span className="sr-only">{t('close')}</span>
</button>
)
}
export default Close