import React, { FC, useContext } from 'react';
import classNames from 'classnames';
import { ConfigContext } from '../config-provider';

export type NewBadgeColor = 'default' | 'green' | 'blue' | 'red' | 'yellow' | 'purple';

export interface NewBadgeProps extends React.HTMLAttributes<HTMLSpanElement> {
  /** 状态（颜色） */
  color?: NewBadgeColor;
}

const NewBadge: FC<NewBadgeProps> = ({ color, children, ...rest }) => {
  const { getPrefixCls } = useContext(ConfigContext);
  const prefixCls = getPrefixCls('new-badge');

  return (
    <span
      {...rest}
      className={classNames(
        prefixCls,
        {
          [`${prefixCls}-${color}`]: !!color,
        },
        rest.className,
      )}
    >
      {children}
    </span>
  );
};

export default NewBadge;