import { Box, Icon } from '@rocket.chat/fuselage';
import React, { ComponentProps, ReactElement, ReactNode } from 'react';

type CardIconProps = { children: ReactNode } | ComponentProps<typeof Icon>;

const hasChildrenProp = (props: CardIconProps): props is { children: ReactNode } => 'children' in props;

const CardIcon = (props: CardIconProps): ReactElement => (
	<Box minWidth='x16' display='inline-flex' flexDirection='row' alignItems='flex-end' justifyContent='center'>
		{hasChildrenProp(props) ? props.children : <Icon size='x16' {...props} />}
	</Box>
);

export default CardIcon;