27 lines
694 B
TypeScript
27 lines
694 B
TypeScript
import { Badge, BadgeProps, Box, Icon, Stack } from '@chakra-ui/react';
|
|
import { ReactNode } from 'react';
|
|
|
|
export function IconBadge({
|
|
children,
|
|
iconClass,
|
|
backgroundColor,
|
|
size = 'lg'
|
|
}: {
|
|
children?: ReactNode;
|
|
iconClass: string;
|
|
backgroundColor?: BadgeProps['backgroundColor'];
|
|
size?: 'sm' | 'md' | 'lg' | 'xs';
|
|
}) {
|
|
return (
|
|
<Box flex={1} direction="row" justifyContent="center" alignItems="center">
|
|
<Badge variant="solid" size={size} backgroundColor={backgroundColor}>
|
|
<Stack direction="row">
|
|
<Icon fontSize="xl">
|
|
<i className={iconClass} />
|
|
</Icon>
|
|
{children}
|
|
</Stack>
|
|
</Badge>
|
|
</Box>
|
|
);
|
|
}
|