hensei-web/components/reps/RepSegment/index.tsx
Justin Edmund 1c09a5cc9c Added RepSegment
This is a Character, Weapon or Summon rep wrapped with an input and label for use in a SegmentedControl
2023-04-16 03:49:21 -07:00

34 lines
780 B
TypeScript

import React, { PropsWithChildren } from 'react'
import './index.scss'
interface Props {
controlGroup: string
inputName: string
name: string
selected: boolean
onClick: (event: React.ChangeEvent<HTMLInputElement>) => void
}
const RepSegment = ({ children, ...props }: PropsWithChildren<Props>) => {
return (
<div className="RepSegment">
<input
name={props.controlGroup}
id={props.inputName}
value={props.inputName}
type="radio"
checked={props.selected}
onChange={props.onClick}
/>
<label htmlFor={props.inputName}>
<div className="Wrapper">
{children}
<div className="Title">{props.name}</div>
</div>
</label>
</div>
)
}
export default RepSegment