import React from 'react'

import './index.scss'

interface Props {
  groupName: string
  name: string
  selected: boolean
  children: string
  onClick: (event: React.ChangeEvent<HTMLInputElement>) => void
}

const Segment: React.FC<Props> = (props: Props) => {
  return (
    <div className="Segment">
      <input
        name={props.groupName}
        id={props.name}
        value={props.name}
        type="radio"
        checked={props.selected}
        onChange={props.onClick}
      />
      <label htmlFor={props.name}>{props.children}</label>
    </div>
  )
}

export default Segment