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

0% Statements 0/2
0% Branches 0/5
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
    29
    30
    31
    32

     import { type ReactNode, type HTMLAttributes } from 'react';

    interface CardProps extends HTMLAttributes<HTMLDivElement> {
      children: ReactNode;
      variant?: 'default' | 'subtle' | 'elevated';
      hoverable?: boolean;
    }

    const variantShadow: Record<string, string> = {
      default: 'shadow-card',
      subtle: 'shadow-subtle',
      elevated: 'shadow-elevated',
    };

    function Card({ children, variant = 'default', hoverable = false, className = '', ...props }: CardProps) {
      return (
        <div
          className={`
            rounded-card bg-white dark:bg-gray-50 p-6 border border-border/50
            ${variantShadow[variant]}
            ${hoverable ? 'transition-card hover:shadow-card-hover' : ''}
            ${className}
          `}
          {...props}
        >
          {children}
        </div>
      );
    }

    export { Card };