@sinchsmb/ui-kit/src/components/Badge/types.ts

UI kit for SinchSMB frontend

import { AriaAttributes, ReactElement, ReactNode } from 'react';

import { CommonProps } from '../../types';
import { IconGlyph } from '../Icon/constants';

import { BadgeColor, BadgeVariant } from './constants';

export interface CommonBadgeProps extends CommonProps {
  /** If true, the badge will contain an icon. */
  icon?: IconGlyph | ReactElement;
  /**
   * If given, the badge will be colored with given color.
   *
   * @default {@link BadgeColor.Default}
   */
  color?: BadgeColor;
  /**
   * Badge variant.
   *
   * @default {@link BadgeVariant.Default}
   */
  variant?: BadgeVariant;
  /** The children to display inside the badge. */
  children: ReactNode;
  ariaLabel?: AriaAttributes['aria-label'];
  ariaDescribedBy?: AriaAttributes['aria-describedby'];
}