import { isImageSource } from "../utils";

type WordImageProps = {
  value: string;
  label: string;
};

export function WordImage({ value, label }: WordImageProps) {
  if (!value) {
    return null;
  }

  if (isImageSource(value)) {
    return (
      <img
        src={value}
        alt={label}
        className="pk-word-image size-[clamp(54px,7vw,92px)] rounded-lg object-contain"
      />
    );
  }

  return <span className="pk-word-emoji text-[clamp(44px,6vw,76px)] leading-none">{value}</span>;
}