import type { LucideIcon } from "lucide-react";
import styles from "./Card.module.css";

interface CardProps {
  title?: string;
  icon?: LucideIcon;
  actions?: React.ReactNode;
  children: React.ReactNode;
  noPad?: boolean;
  className?: string;
}

export default function Card({ title, icon: Icon, actions, children, noPad, className }: CardProps) {
  return (
    <div className={[styles.card, className].filter(Boolean).join(" ")}>
      {(title || actions) && (
        <div className={styles.header}>
          <div className={styles.title}>
            {Icon && <Icon size={15} className={styles.titleIcon} />}
            {title}
          </div>
          {actions && <div className={styles.actions}>{actions}</div>}
        </div>
      )}
      <div className={noPad ? styles.bodyNoPad : styles.body}>{children}</div>
    </div>
  );
}