import { FC } from 'react'
import Radio from './Radio'


type Props = {
    items: {
        label: string
        value: string
    }[]
    selected: string
    onChange: (value: string) => void
}

const RadioGroup: FC<Props> = (props: Props) => {
    return (
        <div className='flex justify-between xl:justify-start gap-5 items-center text-xs'>
            {
                props.items.map((item, index) => (
                    <div key={index} className='flex gap-2 items-center'>
                        <Radio value={item.value} onChange={props.onChange} isActive={item.value === props.selected} />
                        <div className='mt-0.5'>
                            {item.label}
                        </div>
                    </div>
                ))
            }
        </div>
    )
}

export default RadioGroup