React Radio Buttons Group

React component for a group of radio buttons built with and for React.

Installation

npm install react-radio-buttons-group --save

Usage

<ReactRadioButtonsGroup/> with a list of <ReactRadioButton/> components generate a hidden radio inputs that contain checked value, so you can submit it as part of a standard form.

When the value is changed, onChange(inputRadioValue) will fire.

import { ReactRadioButtonsGroup, ReactRadioButton } from 'react-radio-buttons-group';
 
const RadioButtons = () => (
    <ReactRadioButtonsGroup group='sex' onChange={(value) => console.log(value)}>
        <ReactRadioButton value='male'>Male 👨</ReactRadioButton>
        <ReactRadioButton value='female'>Female 👩</ReactRadioButton>
    </ReactRadioButtonsGroup>
);

Demo & Examples

Coming soon...

Components API

<ReactRadioButtonsGroup/>

Property	Type	Description
children	function	Child function responsible for rendering the <ReactRadioButton/> components.
group	string	Field name, for hidden <input /> tags
onChange	function	Function responsible for handling radio group changes. (inputRadioValue) => { }

<ReactRadioButton/>

Property	Type	Description
children	function	Child function responsible for rendering the content into the <label>.
value	string	Attribute value for hidden <input type='radio' /> tag. Also uses as id attribute for <input type='radio' /> and for attribute for <label>.