import { countryName, flagEmoji } from "@/lib/format";
import { cn } from "./cn";

/** Emoji flag from iso2 with accessible name; optional text label. */
export function CountryFlag({ iso2, withName, className, size = 14 }: { iso2: string | null | undefined; withName?: boolean; className?: string; size?: number }) {
  if (!iso2) return withName ? <span className={cn("text-ink-3", className)}>—</span> : null;
  const name = countryName(iso2);
  return (
    <span className={cn("inline-flex items-center gap-1.5", className)} title={name}>
      <span role="img" aria-label={name} style={{ fontSize: size, lineHeight: 1 }} className="font-[emoji]">
        {flagEmoji(iso2)}
      </span>
      {withName && <span className="truncate">{name}</span>}
      {!withName && <span className="sr-only">{name}</span>}
    </span>
  );
}