import type { RadioChangeEvent, RadioGroupProps, SpaceProps } from 'antd';
import { Radio as AntRadio, Space } from 'antd';
import type { CheckboxOptionType } from 'antd/lib/checkbox';
import type { Key } from 'react';

type RadioProps = Omit<RadioGroupProps, 'onChange' | 'options'> & {
  onChange?: (value: unknown) => void;
  options?: CheckboxOptionType[];
  spaceProps?: SpaceProps;
};

export default function Radio({
  value = null,
  options,
  spaceProps,
  onChange,
  ...props
}: RadioProps) {
  function handleChange(event: RadioChangeEvent) {
    if (onChange) onChange(event.target.value);
  }

  return (
    <AntRadio.Group onChange={handleChange} value={value} {...props}>
      <Space {...spaceProps}>
        {options?.map((option) => (
          <AntRadio key={option.value as Key} value={option.value}>
            {option.label}
          </AntRadio>
        ))}
      </Space>
    </AntRadio.Group>
  );
}