overleaf/services/web/frontend/js/shared/components/badge.tsx
Ilkin Ismailov dd5509b16f add sm size to badge
GitOrigin-RevId: 4e69d582ce770abcff10f3a6b34662f4873fc224
2023-04-21 08:03:33 +00:00

45 lines
994 B
TypeScript

import classnames from 'classnames'
import { MergeAndOverride } from '../../../../types/utils'
type BadgeProps = MergeAndOverride<
React.ComponentProps<'span'>,
{
prepend?: React.ReactNode
children: React.ReactNode
className?: string
closeButton?: boolean
onClose?: (e: React.MouseEvent<HTMLButtonElement>) => void
closeBtnProps?: React.ComponentProps<'button'>
size?: 'sm'
}
>
function Badge({
prepend,
children,
className,
closeButton = false,
onClose,
closeBtnProps,
size,
...rest
}: BadgeProps) {
return (
<span className={classnames('badge-new', className)} {...rest}>
{prepend}
<span className="badge-new-comment">{children}</span>
{closeButton && (
<button
type="button"
className="badge-new-close"
onClick={onClose}
{...closeBtnProps}
>
<span aria-hidden="true">&times;</span>
</button>
)}
</span>
)
}
export default Badge