import type { ElementType, FC, HTMLAttributes, RefObject } from 'react';
import classnames from 'classnames';
import React from 'react';

export interface CardProps extends HTMLAttributes<HTMLElement> {
  innerRef?: RefObject<any>;
  size?: 'sm' | 'lg';
  borderless?: boolean;
  tag?: ElementType;
}

const Card: FC<CardProps> = ({ className, size, borderless, tag: Tag = 'div', innerRef, ...rest }) => (
  <Tag
    className={classnames('card', size && `card-${size}`, borderless && `card-borderless`, className)}
    data-testid="Card"
    ref={innerRef}
    {...rest}
  />
);

export default Card;
