import { getPaymentVisualStyle } from "@/lib/finance/paymentVisualStyle";
import type { CalendarEventType, PaymentSourceType } from "@/types/finance";

export function PaymentBadge({
  sourceType,
  status,
  children,
}: {
  sourceType: PaymentSourceType | CalendarEventType | "income";
  status?: string;
  children: React.ReactNode;
}) {
  return (
    <span
      className={`inline-flex rounded-full border px-2 py-1 text-xs ${getPaymentVisualStyle(sourceType, status).badge}`}
    >
      {children}
    </span>
  );
}