import {ReactNode} from 'react';
import {ColorsNameType} from '../../../../types/entities/colors-name';

export type BadgeVariantsType = 'modern' | 'outlined' | 'contained';
export type BadgeSizesType = 'sm' | 'md' | 'lg';
export type BadgeRoundsType = 'sm' | '2xl';
export type BadgeColorsType = ColorsNameType;

export interface IBadge {
    variant?: BadgeVariantsType;
    size?: BadgeSizesType;
    round?: BadgeRoundsType;
    color?: BadgeColorsType;
    startIcon?: ReactNode;
    endIcon?: ReactNode;
    jsxElement?: ReactNode;
    dotIcon?: boolean;
    closeIcon?: {
        props?: React.DetailedHTMLProps<
            React.HTMLAttributes<HTMLDivElement>,
            HTMLDivElement
        >;
        show: boolean;
    };
    avatar?: string;
    text?: string;
    className?: string;
}

export interface IBadgeIcon {
    color: ColorsNameType;
}