# All files / src/components/ui Badge.tsx

0% Statements 0/2
0% Branches 0/2
0% Functions 0/1
0% Lines 0/2

Press n or j to go to the next uncovered block, b, p or k for the previous block.

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28

     import { type ReactNode } from 'react';

    interface BadgeProps {
      children: ReactNode;
      color?: 'blue' | 'red' | 'green' | 'gray' | 'yellow' | 'purple' | 'orange';
      className?: string;
    }

    const colorClasses: Record<string, string> = {
      blue: 'bg-accent-bg text-accent',
      red: 'bg-badge-red-bg text-badge-red-text',
      green: 'bg-badge-green-bg text-badge-green-text',
      gray: 'bg-badge-gray-bg text-badge-gray-text',
      yellow: 'bg-badge-yellow-bg text-badge-yellow-text',
      purple: 'bg-badge-purple-bg text-badge-purple-text',
      orange: 'bg-badge-orange-bg text-badge-orange-text',
    };

    function Badge({ children, color = 'blue', className = '' }: BadgeProps) {
      return (
        <span className={`inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium ${colorClasses[color]} ${className}`}>
          {children}
        </span>
      );
    }

    export { Badge };