Web: components: RadioButtonGroup: added isDisabledGroup prop

This commit is contained in:
Daniil Senkiv 2019-07-26 10:42:21 +03:00
parent 8db94c83d3
commit 2e1fba1ce1
2 changed files with 5 additions and 2 deletions

View File

@ -5,6 +5,7 @@ import styled from 'styled-components';
const StyledDiv = styled.div` const StyledDiv = styled.div`
display: flex; display: flex;
flex-wrap: wrap;
`; `;
class RadioButtonGroup extends React.Component { class RadioButtonGroup extends React.Component {
@ -38,7 +39,7 @@ class RadioButtonGroup extends React.Component {
value={option.value} value={option.value}
checked={this.state.selectedOption === option.value} checked={this.state.selectedOption === option.value}
onChange={this.handleOptionChange} onChange={this.handleOptionChange}
disabled={option.disabled} disabled={this.props.isDisabledGroup || option.disabled}
label={option.label} label={option.label}
spaceBtwnElems={this.props.spaceBtwnElems} spaceBtwnElems={this.props.spaceBtwnElems}
/> />
@ -52,6 +53,7 @@ class RadioButtonGroup extends React.Component {
}; };
RadioButtonGroup.propTypes = { RadioButtonGroup.propTypes = {
isDisabledGroup: PropTypes.bool,
name: PropTypes.string.isRequired, name: PropTypes.string.isRequired,
options: PropTypes.arrayOf(PropTypes.shape({ options: PropTypes.arrayOf(PropTypes.shape({
value: PropTypes.string.isRequired, value: PropTypes.string.isRequired,
@ -63,6 +65,7 @@ RadioButtonGroup.propTypes = {
} }
RadioButtonGroup.defaultProps = { RadioButtonGroup.defaultProps = {
isDisabledGroup: false,
selected: undefined, selected: undefined,
spaceBtwnElems: 33 spaceBtwnElems: 33
} }

View File

@ -13,7 +13,7 @@ storiesOf('Components|Input', module)
return ( return (
<Section> <Section>
<> <>
<RadioButtonGroup selected={text('selected radio button(value)', 'second')} spaceBtwnElems={number('spaceBtwnElems', 33)} name={text('name of your group', 'group')} options={ <RadioButtonGroup isDisabledGroup={boolean('isDisabledGroup', false)} selected={text('selected radio button(value)', 'second')} spaceBtwnElems={number('spaceBtwnElems', 33)} name={text('name of your group', 'group')} options={
[ [
{ value: text('value 1st radiobutton', 'first'), label: text('label 1st radiobutton', 'First radiobtn'), disabled: boolean('isDisabled 1st radiobutton', false) }, { value: text('value 1st radiobutton', 'first'), label: text('label 1st radiobutton', 'First radiobtn'), disabled: boolean('isDisabled 1st radiobutton', false) },
{ value: text('value 2nd radiobutton', 'second'), label: text('label 2nd radiobutton', 'Second radiobtn'), disabled: boolean('isDisabled 2nd radiobutton', true) }, { value: text('value 2nd radiobutton', 'second'), label: text('label 2nd radiobutton', 'Second radiobtn'), disabled: boolean('isDisabled 2nd radiobutton', true) },