import styles from "./RadioGroup.module.css";

interface RadioOption {
  value: string;
  label: string;
}

interface RadioGroupProps {
  label?: string;
  name: string;
  options: RadioOption[];
  value: string;
  onChange: (value: string) => void;
  disabled?: boolean;
}

export default function RadioGroup({ label, name, options, value, onChange, disabled }: RadioGroupProps) {
  return (
    <div className={styles.wrap}>
      {label && <div className={styles.groupLabel}>{label}</div>}
      <div className={styles.list}>
        {options.map((opt) => (
          <label key={opt.value} className={`${styles.item} ${disabled ? styles.disabled : ""}`}>
            <input
              type="radio"
              className={styles.input}
              name={name}
              value={opt.value}
              checked={value === opt.value}
              onChange={() => onChange(opt.value)}
              disabled={disabled}
            />
            <span className={styles.label}>{opt.label}</span>
          </label>
        ))}
      </div>
    </div>
  );
}